wow.js 使用方法
使用方法：
1、wow.js依赖于animate.css，首先需要在 head内引入animate.css或者animate.min.css。
<link rel="stylesheet" href="css/animate.css">
2、引入wow.js或者wow.min.js，然后js文件里再写一行代码。
<script src="js/wow.min.js"></script> <script> new WOW().init(); </script>
3、然后在块状元素内添加相应的class类名就能实现相应的动画啦
<div class="wow slideInLeft" data-wow-duration="2s" //动画持续时间 data-wow-offset="10" //动画延迟时间 data-wow-iteration="10">//动画执行次数 </div>
原码演示
<!DOCTYPE html>
<html>
<head>
<title>wow演示</title>
<meta charset="utf-8">
<!-- 1.引入wow依赖的animate.css -->
<link href="css/animate.css" rel="stylesheet" type="text/css">
<!-- 2.引入wow.js 文件 -->
<script type="text/javascript" src="js/wow.js"></script>
<!-- 3.now 对象 -->
<script type="text/javascript">
new WOW().init();
// 可选的参数
// wow = new WOW({
// boxClass: 'wow', //WOW.js需要执行动画的元素的class
// animateClass: 'animated', //animation.css 动画的 class
// offset: 0, //距离可视区域多少开始执行动画
// mobile: true, //是否在移动设备上执行动画
// live: true //异步加载的内容是否有效
// })
// wow.init();
</script>
</head>
<body>
<div class="wow slideInLeft" data-wow-duration="3s" data-wow-delay="1s" data-wow-offset="1000" data-wow-iteration="1" style="width: 500px;height: 2000px;background-color: #ccc;position: absolute;left: 50%;margin-top: 0px;margin-left: -250px;margin-bottom: 50px">
wow 动画演示
</div>
<!-- slideInLeft 动画样式 -->
<!-- data-wow-duration 动画持续时间 -->
<!-- data-wow-delay 动画延迟时间 -->
<!-- data-wow-offset 元素的位置（左上角的位置）露出后距离底部多少像素时执行 -->
<!-- data-wow-iteration 动画执行次数 -->
</body>
</html>补充：
data-wow-duration（动画持续时间）
data-wow-delay（动画延迟时间）
data-wow-offset（元素的位置露出后距离底部多少像素执行）
data-wow-iteration（动画执行次数）
