jquery.animator.js是一款基于animate.css的jquery动画插件。Animator插件可以为DOM元素提供各种animate.css中设定的CSS3动画，并额外提供当DOM元素进入视口时触发CSS3动画的方法。

使用方法

在页面中引入jquery和jquery.animator-beta.min.js文件，以及animate.css样式文件。

<link href="path/to/css/animate.css" rel="stylesheet">
<script src="path/to/js/jquery.min.js"></script>
<script src="path/to/js/jquery.animator-beta.min.js"></script>          
                

使用插件

要为一个目标DOM元素设置动画效果，可以简单的使用下面的jquery代码。

$('#target-elem').addAnimation('lightSpeedIn',500);
                

其中lightSpeedIn是animate.css中设定的CSS3动画名称。

如果需要在元素进入视口时，触发指定的CSS3动画，可以使用下面的代码：

if($('#target-elem').isOnScreen()){
  $('#target-elem').addAnimation('lightSpeedIn');
}                  
                

你也可以将DOM元素上指定的动画移除：

$('#ele').removeAnimation('lightSpeedIn');                  
                

jquery.animator.js-jquery动画插件的github地址为：https://github.com/zugoripls/jquery.animator

在线预览    源码下载