JS库之wow.js使用方法


Posted in Javascript onSeptember 14, 2017

近日,在做项目中,需要做到滚动条滑到某个位置时,才能显示动画,网上查询到有个wow.js可以达到要求,现在把使用方法做如下总结:

wow.js演示地址

wow.js的github地址

使用方法真是超简单~~

需要配合Animated.css使用

方法如下:

1.引用wow.js或者wow.min.js 和 animate.css

JS库之wow.js使用方法

2.在需要用到这个效果的元素上面添加class="wow fadeInUp" 和 data-wow-delay=".1s",具体所表示的含义在下图中有说明

JS库之wow.js使用方法

3.初始化wow.js

JS库之wow.js使用方法

代码如下:

 <script>
wow = new WOW({
  
animateClass: ‘animated‘,
  });
  wow.init();

</script>

总结

以上所述是小编给大家介绍的S库之wow.js使用方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
图片格式的JavaScript和CSS速查手册
Aug 20 Javascript
javascript 学习笔记(八)javascript对象
Apr 12 Javascript
js简易namespace管理器 实例代码
Jun 21 Javascript
动态加载jQuery的两种方法实例分析
Jul 17 Javascript
关于iframe跨域POST提交的方法示例
Jan 15 Javascript
JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
Jan 20 Javascript
基于jQuery实现的Ajax 验证用户名唯一性实例代码
Jun 28 jQuery
Node使用Sequlize连接Mysql报错:Access denied for user ‘xxx’@‘localhost’
Jan 03 Javascript
Angular17之Angular自定义指令详解
Jan 21 Javascript
Vue打包后访问静态资源路径问题
Nov 08 Javascript
Vue-cli打包后如何本地查看的操作
Sep 02 Javascript
vue-router中hash模式与history模式的区别
Jun 23 Vue.js
JavaScript正则表达式和级联效果
Sep 14 #Javascript
详解使用Visual Studio Code对Node.js进行断点调试
Sep 14 #Javascript
react 父组件与子组件之间的值传递的方法
Sep 14 #Javascript
分分钟学会vue中vuex的应用(入门教程)
Sep 14 #Javascript
JS中跳出循环的示例代码
Sep 14 #Javascript
JS验证码实现代码
Sep 14 #Javascript
快速将Vue项目升级到webpack3的方法步骤
Sep 14 #Javascript
You might like
解决中英文字符串长度问题函数
2007/01/16 PHP
php安全开发 添加随机字符串验证,防止伪造跨站请求
2013/02/14 PHP
phpphp图片采集后按原路径保存图片示例
2014/02/18 PHP
Smarty foreach控制循环次数的一些方法
2015/07/01 PHP
PHP接收App端发送文件流的方法
2016/09/23 PHP
PHP实现二叉树深度优先遍历(前序、中序、后序)和广度优先遍历(层次)实例详解
2018/04/20 PHP
ThinkPHP框架实现的邮箱激活功能示例
2018/06/15 PHP
jQuery 入门讲解1
2009/04/15 Javascript
jQuery.prop() 使用详解
2015/07/19 Javascript
jQuery实现的简单提示信息插件
2015/12/08 Javascript
js常用的继承--组合式继承
2017/03/06 Javascript
微信小程序 动态绑定数据及动态事件处理
2017/03/14 Javascript
vue学习笔记之指令v-text &amp;&amp; v-html &amp;&amp; v-bind详解
2017/05/12 Javascript
angularjs+bootstrap实现自定义分页的实例代码
2017/06/19 Javascript
mongoose更新对象的两种方法示例比较
2017/12/19 Javascript
详解AngularJS之$window窗口对象
2018/01/17 Javascript
JS对象与json字符串相互转换实现方法示例
2018/06/14 Javascript
JS实现获取进今年第几天是周几的方法分析
2018/06/27 Javascript
JavaScript获取当前url路径过程解析
2019/12/27 Javascript
详解实现vue的数据响应式原理
2021/01/20 Vue.js
[01:55]TI9显影之尘系列 - Evil Geniuses
2019/08/22 DOTA
python列出目录下指定文件与子目录的方法
2015/07/03 Python
Jupyter中直接显示Matplotlib的图形方法
2018/05/24 Python
如何使用Python标准库进行性能测试
2019/06/25 Python
python 计算两个列表的相关系数的实现
2019/08/29 Python
canvas学习笔记之绘制简单路径
2019/01/28 HTML / CSS
日本最大的旅游网站:Rakuten Travel(乐天旅游)
2018/08/02 全球购物
Shopbop中文官网:美国亚马逊旗下时尚购物网站
2020/12/15 全球购物
深圳-东方伟业笔试部分
2015/02/11 面试题
晚宴邀请函范文
2014/01/15 职场文书
党校培训自我鉴定
2014/02/01 职场文书
卫生安全检查制度
2014/02/04 职场文书
校运动会广播稿300字
2014/10/07 职场文书
环卫个人总结
2015/03/03 职场文书
2015年超市工作总结
2015/04/09 职场文书
python之np.argmax()及对axis=0或者1的理解
2021/06/02 Python