animate.html
2024-09-01 11:02:35
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/animate.css"/>
<style type="text/css">
.div1{
width: 300px;
height: 300px;
background: skyblue;
margin: 10 auto;
}
</style>
</head>
<body>
<div class="div1 wow bounceIn"> </div>
<div class="div1 wow bounceIn"> </div>
<div class="div1 wow bounceIn"> </div>
<div class="div1 wow bounceIn"> </div>
<div class="div1 wow bounceIn"> </div>
<div class="div1 wow bounceIn"> </div>
<div class="div1 wow bounceIn"> </div>
<div class="div1 wow bounceIn"> </div> <!--
持续时间/延迟时间/偏移值/迭代次数
-->
<div class="div1 wow slideInLeft" data-wow-duration="2s" data-wow-delay="5s"></div>
<div class="div1 wow slideInRight" data-wow-offset="10" data-wow-iteration="10"></div> <script src="js/wow.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var obj = {
boxClass: 'wow',
animateClass: 'animated',
offset: 0,
mobile: true,
live: true
}
new WOW(obj).init(); //属性/方法 类型 默认值 说明
//boxClass 字符串 ‘wow’ ‘wow’需要执行动画的元素的 class
//animateClass 字符串 ‘animated’ ‘animated’animation.css 动画的 class
//offset 整数 0 距离可视区域多少开始执行动画
//mobile 布尔值 true 是否在移动设备上执行动画
//live 布尔值 true 异步加载的内容是否有效
</script>
</body>
</html>
最新文章
- [PHP源码阅读]strpos、strstr和stripos、stristr函数
- POJ1236Network of Schools[强连通分量|缩点]
- iOS点击状态栏返回顶部问题。
- jQuery与Ajax的应用——《锋利的jQuery》（第2版）读书笔记3
- 实例学习Backbone.js（一）
- html空格小结
- Rhel6-heartbeat+lvs配置文档
- 如何真正免费运营推广APP应用
- 为Photoshop添加右键快捷
- Java 并发编程（三）为线程安全类中加入新的原子操作
- KNN算法的理解
- Apache Commons介绍（转载）
- 使用JWT来实现对API的授权访问
- if __name__ == "__main__"：
- [转]一台电脑上的git同时使用两个github账户
- 微服务之springCloud-docker-hystrix-dashboard-turbine（九）
- php远程获取图片或文件信息(get_headers,fsocketopen,curl)
- [黑金原创教程] FPGA那些事儿《数学篇》- CORDIC 算法
- Linux的计划任务
- 十、cent OS开启APR模式报错：configure: error: Found APR 1.3.9. You need version 1.4.3 or newer installed