Directory

animation-keyframes - Vaadin Add-on Directory

Generator of animation keyframes for performant expand/collapse effect animation-keyframes - Vaadin Add-on Directory
**[ This description is mirrored from README.md at [github.com/valdrinkoshi/animation-keyframes](https://github.com//valdrinkoshi/animation-keyframes/blob/v0.4.2/README.md) on 2019-05-10 ]** [![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/valdrinkoshi/animation-keyframes) [![Build Status](https://travis-ci.org/valdrinkoshi/animation-keyframes.svg?branch=master)](https://travis-ci.org/valdrinkoshi/animation-keyframes) # \ \ generates keyframes for performant expand/collapse. See more details on this technique [here](https://developers.google.com/web/updates/2017/03/performant-expand-and-collapse). Use this element to generate the stylesheet and save it as a static resource. ```html

Performant expand animation!

animation-keyframes generated the keyframes for this animation.

  • item 1
  • item 2
  • item 3
``` ## Live demo https://valdrinkoshi.github.io/animation-keyframes/ ## Contributing ### Install the Polymer-CLI First, make sure you have the [Polymer CLI](https://www.npmjs.com/package/polymer-cli) installed. Then run `polymer serve` to serve your element locally. ### Viewing Your Element ``` $ polymer serve ``` ### Running Tests ``` $ polymer test ``` Your application is already set up to be tested via [web-component-tester](https://github.com/Polymer/web-component-tester). Run `polymer test` to run your application's test suite locally. ## License [MIT](https://opensource.org/licenses/MIT)