如何解决Wow js 不适用于 Fullpage JS
我正在图像的页面加载中添加 ZoomIn 动画。但是由于 FullpageJS,动画无法正常工作。
这是我的代码
HTML 代码:
<div class="wow zoomIn" data-wow-duration="0.5s" data-wow-delay="0.2s">
<img src="images/image-3.jpg" alt="..." class="img-fluid">
</div>
JS 代码:
$(function () {
new WOW().init();
});
$(document).ready(function () {
// Options
$('#fullpage').fullpage({
autoScrolling: true,scrollHorizontally: true,scrollingSpeed: 1300,scrolloverflow: true,navigation: true,navigationPosition: 'right',slidesNavigation: true,afterRender: function () {
new WOW().init();
},afterLoad: function () {
new WOW().init();
}
});
//methods
$.fn.fullpage.setAllowScrolling(true);
});
解决方法
您需要在初始化时使用 fullpage.js 选项 scrollBar:true
。
这样 fullPage.js 将使用滚动条滚动,这是 wow.js 需要的滚动条,以便触发它用来触发动画的滚动事件。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。