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的一种模块模式
Sep 08 Javascript
jquery与prototype框架的详细对比
Nov 21 Javascript
jquery改变disabled的boolean状态的三种方法
Dec 13 Javascript
js购物车实现思路及代码(个人感觉不错)
Dec 23 Javascript
JavaScript字符串对象split方法入门实例(用于把字符串分割成数组)
Oct 16 Javascript
js实现非常简单的焦点图切换特效实例
May 07 Javascript
JavaScript中判断两个字符串是否相等的方法
Jul 07 Javascript
浅谈JavaScript find 方法不支持IE的问题
Sep 28 Javascript
如何进行微信公众号开发的本地调试的方法
Jun 16 Javascript
浅谈JS中几种轻松处理'this'指向方式
Sep 16 Javascript
VueCli4项目配置反向代理proxy的方法步骤
May 17 Javascript
解决Vue-cli3没有vue.config.js文件夹及配置vue项目域名的问题
Dec 04 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
第六节 访问属性和方法 [6]
2006/10/09 PHP
php获取目标函数执行时间示例
2014/03/04 PHP
PHP资源管理框架Assetic简介
2014/06/12 PHP
php函数serialize()与unserialize()用法实例
2014/11/06 PHP
thinkphp3.2实现上传图片的控制器方法
2016/04/28 PHP
php通过两层过滤获取留言内容的方法
2016/07/11 PHP
PHP后台备份MySQL数据库的源码实例
2019/03/18 PHP
参考:关于Javascript中实现暂停的几篇文章
2007/03/04 Javascript
Colortip基于jquery的信息提示框插件在IE6下面的显示问题修正方法
2010/12/06 Javascript
23个超流行的jQuery相册插件整理分享
2011/04/25 Javascript
表单元素的submit()方法和onsubmit事件应用概述
2013/02/01 Javascript
JQuery 使用attr方法实现下拉列表选中
2014/10/13 Javascript
AngularJS 使用 UI Router 实现表单向导
2016/01/29 Javascript
jquery ztree实现模糊搜索功能
2016/02/25 Javascript
微信小程序 简单DEMO布局,逻辑,样式的练习
2016/11/30 Javascript
JS对象是否拥有某属性如何判断
2017/02/03 Javascript
Vue组件和Route的生命周期实例详解
2018/02/10 Javascript
vue中子组件传递数据给父组件的讲解
2019/01/27 Javascript
layer.alert回调函数执行关闭弹窗的实例
2019/09/11 Javascript
vue使用vue-quill-editor富文本编辑器且将图片上传到服务器的功能
2021/01/13 Vue.js
[55:47]DOTA2上海特级锦标赛C组小组赛#2 LGD VS Newbee第三局
2016/02/27 DOTA
[53:52]EG vs VGJ.T 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Jupyter notebook在mac:linux上的配置和远程访问的方法
2019/01/14 Python
情人节快乐! python绘制漂亮玫瑰
2020/08/18 Python
Python编译为二进制so可执行文件实例
2019/12/23 Python
Tensorflow累加的实现案例
2020/02/05 Python
Python绘制全球疫情变化地图的实例代码
2020/04/20 Python
详解python安装matplotlib库三种失败情况
2020/07/28 Python
详解通过HTML5 Canvas实现图片的平移及旋转变化的方法
2016/03/22 HTML / CSS
智能钱包:Ekster
2019/11/21 全球购物
linux比较文件内容的命令是什么
2013/03/04 面试题
产品促销活动策划书
2014/01/15 职场文书
公司委托书格式
2014/08/01 职场文书
实践论读书笔记
2015/06/29 职场文书
CSS3 实现的图片悬停的切换按钮
2021/04/13 HTML / CSS
怎么禁用Win11输入法 最新Win11输入法关闭教程
2022/08/05 数码科技