A minimal, super lightweight (3KB minimized and gzipped), zero dependency, JavaScript animation library.
# Installation
npm install animol --save
1
# Basic usage
import * as animol from 'animol';
const myElement = document.getElementById('my-element');
animol.css(
myElement, // DOM element
2000, // Duration
{ marginLeft: '0px', backgroundColor: '#FF0000' }, // From
{ marginLeft: '200px', backgroundColor: '#00FF00' }, // To
animol.Easing.easeInOutCubic, // Easing function
1000 // Delay
);
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
# Documentation
# Motivation
Animol is intended to be super lightweight, ease to use and performant. It abstracts the repetitive logic for calling requestAnimationFrame, easing, and parsing CSS strings.
It's ideal for small projects where you want to do some JavaScript animations without reinventing the wheel, and you don't want to import a large library.
For advanced use cases involving timelines, svg, etc. check out Greensock or Anime.js.
# Browser Compatibility
Compatible with all modern browsers and IE 10+.