Animate.css是一款又酷又有趣的跨浏览器的动画效果集合，当然是CSS效果的。按照github上的介绍:animate.css is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
在我们的项目中引入和使用非常的简单，
1.首先是引入文件，可以下载Animate.css然后在文档内引入
<head> <link rel="stylesheet" href="animate.min.css"> </head>
或者使用CDN版本
<head> <link rel="stylesheet" href="http://s.mlcdn.co/animate.css"> </head>
2.给需要设置动画的元素添加一个animated的class
<img src="demo.html" class="demo animated" alt="demo"/>
如果需要循环这个动画只要再添加"infinite"这个class就可以无限循环动画
<img src="demo.html" class="demo animated infinite" alt="demo"/>
3.最后再加一个动画样式的class，这个class就是你所需要的动画类型，部分动画如下：
bounceflashpulserubberBandshakeheadShakeswingtadawobblejellobounceInbounceInDownbounceInLeftbounceInRightbounceInUpbounceOutbounceOutDownbounceOutLeftbounceOutRightbounceOutUpfadeInfadeInDownfadeInDownBigfadeInLeftfadeInLeftBigfadeInRightfadeInRightBigfadeInUpfadeInUpBigfadeOutfadeOutDownfadeOutDownBigfadeOutLeftfadeOutLeftBigfadeOutRightfadeOutRightBigfadeOutUpfadeOutUpBigflipInXflipInYflipOutXflipOutYlightSpeedInlightSpeedOutrotateInrotateInDownLeftrotateInDownRightrotateInUpLeftrotateInUpRightrotateOutrotateOutDownLeftrotateOutDownRightrotateOutUpLeftrotateOutUpRighthingerollInrollOutzoomInzoomInDownzoomInLeftzoomInRightzoomInUpzoomOutzoomOutDownzoomOutLeftzoomOutRightzoomOutUpslideInDownslideInLeftslideInRightslideInUpslideOutDownslideOutLeftslideOutRightslideOutUp
详细的动画在这里:Animate.css
当然也可以结合jquery去对元素做Animate.css动画的增删，详细请参考作者 github
