Lightweight Pure JavaScript Animation Library – animate.js

Preview:

Description:

animate.js is a lightweight, stand-alone JavaScript library which enables you to apply smooth CSS3 powered animations (e.g. rotate, scale, skew, etc) to any DOM elements.

How to use it:

Load the minified version of animate.js into your document.

<script src="animate.min.js"></script>

Basic usage:

animate({
  // The elements you want to animate. 
  el: "div",
  // The duration of your animation in milliseconds
  duration: 500,
  // The animation curve (CSS keyword or cubic-bezier). 
  easing: "ease",
  // The delay before your animation starts in milliseconds.
  delay: 0,
  // A function called at the end of the animation. 
  complete: function() { alert("Done!") }
  // Custom animations
  opacity: null
  translateX: null
  translateY: null
  translateZ: null
  scaleX: null
  scaleY: null
  scaleZ: null
  rotateX: null
  rotateY: null
  rotateZ: null
  skewX: null
  skewY: null
  perspective:: null
});