美文网首页framework
如何使用WOW.js库

如何使用WOW.js库

作者: w_tiger | 来源:发表于2017-01-05 20:25 被阅读0次

    简介

    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       距离浏览器底部到隐藏框顶部的距离,如下贴图

    配置参数

    相关文章

      网友评论

        本文标题:如何使用WOW.js库

        本文链接:https://www.haomeiwen.com/subject/ffozvttx.html