Lightweight Pure JavaScript Animation Library – animate.js

Category: Animation , Javascript | January 27, 2015
Views Total:1,173 views
Official Page:Go to website
Last Update:January 27, 2015


Lightweight Pure JavaScript Animation Library – animate.js


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:

  // 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

You Might Be Interested In:

Leave a Reply