animation-keyframes

KO | EN

gitlite — search

#python #java #python3 #arduino #golang #machine-learning #rust #html #flask #javascript #seismology #nodejs

animation-keyframes

★ 10 Open GitHub ↗

Generator of animation keyframes for performant expand/collapse effect

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

[![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)

# \<animation-keyframes\>

\<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
<animation-keyframes
      animation-name="myAnimation"
      preset="vertical-expand"
      duration="200">
</animation-keyframes>

## 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)

animation-keyframes

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README