JavaScript animation engine
npm install @immutabl3/animeseek to 0 or initial state did not set initial state or fire updates. code was commented out to allow this, but side effects are currently unknownrequestAnimationFrame calls weren't exposed to sync with other calls. anime no longer starts itself; it needs to be ticked by an outside requestAnimationFrame loop (by importing engine)reduce loops were causing general deoptimizing in browsers, seemingly randomly. these reduces were to perform array flattening (now replaced with .flat()) and sorting and have been replaced or removedforEach), though nice, were creating functions-in-loops deeply. these have been addressed where possible to avoid function creation and reduce spikes in garbage collectionanime call and other encapsulations have been turned into pure functions and/or classesMap & Set where possible to reduce loop work-arounds/indexOf/includes checks
Anime.js (/ˈæn.ə.meɪ/) is a lightweight JavaScript animation library with a simple, yet powerful API.
It works with CSS properties, SVG, DOM attributes and JavaScript Objects.
Getting started | Documentation | Demos and examples | Browser support
Via npm
``bash`
$ npm install animejs --save
or manual download.
#### ES6 modules
`javascript`
import anime from 'animejs/lib/anime.es.js';
#### CommonJS
`javascript`
const anime = require('animejs');
#### File include
Link anime.min.js in your HTML :
`html`
`javascript``
anime({
targets: 'div',
translateX: 250,
rotate: '1turn',
backgroundColor: '#FFF',
duration: 800
});
* Targets
* Properties
* Property parameters
* Animation parameters
* Values
* Keyframes
* Staggering
* Timeline
* Controls
* Callbacks and promises
* SVG Animations
* Easing functions
* Helpers
* CodePen demos and examples
* juliangarnier.com
* animejs.com
* Moving letters by @tobiasahlin
* Gradient topography animation by @crnacura
* Organic shape animations by @crnacura
* Pieces slider by @lmgonzalves
* Staggering animations
* Easings animations
* Sphere animation
* Layered animations
* anime.js logo animation
| Chrome | Safari | IE / Edge | Firefox | Opera |
| --- | --- | --- | --- | --- |
| 24+ | 8+ | 11+ | 32+ | 15+ |

Website | Documentation | Demos and examples | MIT License | © 2019 Julian Garnier.