A jQuery plugin to stack animation and transition over CSS3.
Install with Bower
bower install jquery.animateCSS
Download the development version.
In your web page:
<script src="jquery.js"></script>
<script src="jquery.animateCSS.js"></script>
<script>
$(document).ready( function(){
$('#your-id').animateCSS("fadeIn");
});
</script>
$('#your-id').animateCSS('slideOut');
$('#your-id').animateCSS('slideOut', function(){
console.log('Boom! Animation Complete');
});
If you use the standard jQuery chaining mechanism, each animation will fire at the same time so you have to include the next animation in the callback.
$('#your-id')
.animateCSS('slideOut')
.animateCSS('slideLeft');