页面滚动动画，使用wow.js配合animate.min.css可以让页面轻松实现多用滚动效果，百度下载对应文件（很容易找到），js 和 css 都需要，他们是相互依赖实现效果的。

把下载的文件放到样式文件夹路径后，在需要实现滚动动画的页面引入js和css路径，然后进行一个全局定义，可以放在页面底部。

<script>
  var wow = new WOW({  //WOW需大写
        boxClass: 'wow',  //需要执行动画的元素的 class
        animateClass: 'animated', //动画的 class
        offset: 0,    //距离可视区域多少开始执行动画
        mobile:false,  //是否在移动设备上执行动画
        live: true  //异步加载的内容是否有效
    });
    wow.init();
</script>

全局定义项如上所示，分别所代表的的含义也比较直观，boxClass 值是指定标记元素带有什么类值的时候，就执行动画，一般设置默认，也可以根据需要自定义，但必须设置在块状元素上才有效果。animateClass值保持默认值，因animate.css中已内置了animated的动画类型，换成其它值，无法执行到设置的动画类型。

它的动画参数共有4个，分别是

1、data-wow-delay=""，动画开始前的延迟时间。

2、data-wow-duration="",单次动画完成的过度时间。

3、data-wow-iteration="",动画的循环次数（无限次：infinite）。

4、data-wow-offset="",元素的位置露出后距离底部多少像素执行。

使用方法如下：

<div class="wow fadeInUp" data-wow-delay="0.2s" data-wow-duration="1s", data-wow-iteration="infinite" data-wow-offset="0">*</div>

上面代码wow 是boxClass 值，fadeInUp是动画类型。动画类型很多。

，打开这个网址，可以查看所有参数值和展示方法。