shri / animated

progressive animation for the DOM

##animated animated is a lightweight animation framework originally built by Shri Ganeshram to progressively animate DOM elements on a webpage. It works well with the animate.css framework and depends on animate.css and jQuery.

animated is licensed under the MIT License.

installation

Depends on bower.

bower install animated

Include jquery/dist/jquery.js, animated/animated.js, animated/animated.css, and optionally animate.css/animate.css in your HTML file from your bower_components directory.

use

var animate = new Animated();
animate.add("customClass", "animated animateCSSClass", {
	timeDelay: 150 //delay in ms, default: 200
}); 											//dictionary param is optional

customClass is a class you define to map to animated animateCSSClass.

timeDelay is an option in the optional dictionary to specify delays between animations of each customClass in milliseconds.

Available animateCSSClasses can be found on the animate.css framework website.

Alternatively, use your own css animations in place of animated animateCSSClass.

<div class="preanimated customClass"></div> <!--before animation-->
<div class="animated animateCSSClass"></div> <!--after animation-->