<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>wow.js和animate.css页面滚动特效</title>
<link rel="stylesheet" type="text/css" href="animate.css"/>
</head>
<body>
<!--
data-wow-duration：更改动画持续时间
data-wow-delay：动画开始前的延迟
data-wow-offset：开始动画的距离（与浏览器底部相关）
data-wow-iteration：动画的次数重复（无限次：infinite）
以上四个属性可忽略
-->
<div class="wow slideInLeft"
data-wow-duration="2s"
data-wow-delay="2s"
data-wow-offset="10"
data-wow-iteration="1">123</div>
<script type="text/javascript" src="wow.js"></script>
<script type="text/javascript">
var wow = new WOW({
boxClass: 'wow',// 字符串 ‘wow’ 需要执行动画的元素的 class
animateClass: 'animated',// 字符串 ‘animated’ animation.css 动画的 class
offset: 0,// 距离可视区域多少开始执行动画
mobile: true,// 是否在移动设备上执行动画
live: true// 异步加载的内容是否有效
});
wow.init();
</script>
</body>
</html>
wow.js和animate.css下载地址github
animate.css官网，更多效果请参考
