您现在的位置是:首页 > 技术交流技术交流
fullpage.js和wow兼容问题
2023-02-19【技术交流】3786 人已围观
简介 因为项目是全屏竖向滚动网站,就用到了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
很赞哦! ()
相关文章
随机图文
thinkphp 模板中存值
模板里存值,这样的场景经常使用在循环内需要对变量进行比较判断的情况下.下面我们来看看是如何做到的. 在项目开发的时候,有时候希望直接在模板...
mysql查询今天,昨天,近7天,近30天,本月,上一月数据的方法
MySQL查询今天,昨天,近7天,近30天,本月,上一月数据的方法分析总结:(这篇文章 看到后我仿佛又是看到了新窗户,眼前一亮)mysql还...
万网企业邮箱在Foxmail上POP3/IMAP协议设置方法(多图)
Foxmail7.0POP3/IMAP设置方法如下: 第一步:点击“工具”-“账号管理”-“新建”,填写您的邮件地址,点击“下一步”,如图...
查看thinkphp版本
学习框架的好办法是参考现成的网站,那么学习thinkphp框架第一步就是需要查找自己需要的版本号的程序。方法一:在thinkphp文件夹...




微信收款码
支付宝收款码