1.引入css动画库
2.引入wow.js并且初始化
1.设置css类
将CSS类.wow添加到HTML元素：在用户滚动显示它之前，它将是不可见的。
2.选择动画类型
在Animate.css中选择一个动画样式，然后将CSS类添加到HTML元素中。
data-wow-duration: 更改动画持续时间
data-wow-delay: 动画开始前的延迟
data-wow-offset: 开始动画的距离（与浏览器底部相关）
data-wow-iteration: 动画重复的次数
boxClass: 用户滚动时显示隐藏框的类名。
animateClass: 触发CSS动画的类名（animate.css库默认为'animated'）
offset: 定义浏览器视口底部与隐藏框顶部之间的距离。当用户滚动并到达该距离时，隐藏的框被显示出来。
mobile: 在移动设备上打开/关闭WOW.js。
live: 在页面上不断检查新的WOW元素。
当网页的向下滚动的时候，有些元素会产生细小的动画效果。然而直接用animate.css是不行的如果自己写判断位置和动画结合的话也是可以但是动画效果不是特理想需要多次调试，其次也是很麻烦的所以该插件帮我们 写好了，我们只需要在浏览器滚动到该盒子位置为他加上在animate.css我们需要的效果类名既可。WOW.js 依赖 animate.css，所以它支持 animate.css 多达 60 多种的动画效果，能满足您的各种需求。
兼容性能：；wow.js 使用了 querySelectorAll 方法，IE 低版本会报错。iE10+
缺点 动画效果执行一次 滑到顶部再往下滑动就无效了 需要页面刷新了
