您现在的位置是:首页 > 技术交流技术交流
fullpage.js和wow兼容问题
2023-02-19【技术交流】1529 人已围观
简介 因为项目是全屏竖向滚动网站,就用到了fullpage.js插件和动画插件wow。结果发现wow不会执行了,原来这二个插件有冲突,可以使...
因为项目是全屏竖向滚动网站,就用到了fullpage.js插件和动画插件wow。结果发现wow不会执行了,原来这二个插件有冲突,可以使用以下代码来兼容。
<script type="text/javascript"> $(document).ready(function() { $('#home').fullpage({ // sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'], anchors: ['page1', 'page2', 'page3', 'page4','page5'], // menu: '#menu', css3: true, scrollingSpeed: 1000, /*-------scrollBar 设置为 true ------*/ scrollBar: true, /*-------scrollBar 设置为 true -------*/ /*-------WOW.JS在fullpage之后执行----*/ afterRender: function(){ wow = new WOW({ animateClass: 'animated', }); wow.init(); /*---------------------WOW.JS在fullpage之后执行------------------------*/ } }); }); </script> <style> /*body 增加 overflow:hidden*/ body{ overflow:hidden; } </style>
这里要说一下浏览器的滚动条,如果觉得不美观可以再css进行屏蔽隐藏。
关注宁波网站建设博客,更多精彩分享,敬请期待!
Tags:fullpage.js wow.js
很赞哦! ()
相关文章
随机图文
-
js jquery新打开窗口与新开标签页
在项目中我们设置了一个网友点击下载提示输入邮箱的功能, 如果输入的邮箱正确格式就可以下载样本,这是需要新开窗口而不是把原窗口给关闭了.这... -
Dreamweaver中设置代码视图时的代码字体大小(默认字体)
在Dreamweaver代码视图下,选择“编辑”菜单 ——> 首选参数——> 左边的分类选“新建文档” ——> 右边字体... -
visual C# 保持窗口最前面
属性面板内 this.TopMost=true;即可 -
万网企业邮箱在Foxmail上POP3/IMAP协议设置方法(多图)
Foxmail7.0POP3/IMAP设置方法如下: 第一步:点击“工具”-“账号管理”-“新建”,填写您的邮件地址,点击“下一步”,如图...