framework

如何使用WOW.js库

2017-01-05  本文已影响0人  w_tiger

简介

Wow.js是一个不依赖于jQuery的轻量级js库,其作用就是能够在网页不断往下滚动的时候逐渐释放通过animateCSS添加的这些动画。

注意:必须和animateCSS配合使用。

浏览器兼容性

IE10+     谷歌     火狐     opera    safari

用法步骤

1、引入文件

<link rel="stylesheet" href="animate.min.css"> 

<script src="wow.min.js"></script>

2、HTML
<div class="wow slideInLeft"></div> 

<div class="wow slideInRight"></div>

3、JavaScript

new WOW().init();

wow属性

属性是指写在HTML身上的

data-wow-delay       延迟

data-wow-duration   动画持续的时间

data-wow-iteration   动画重复的次数

data-wow-offset       距离浏览器底部到隐藏框顶部的距离,如下贴图

配置参数

上一篇下一篇

猜你喜欢

热点阅读