如何解决Flexslider - 在最后一张幻灯片上禁用滚动
我目前正在使用 Drupal 8 的 Flexslider 模块。我想创建一个可以用鼠标滚轮控制的垂直旋转木马。滚动存在,但它无休止地循环幻灯片。我希望滚动停止在最后一张幻灯片,以便用户可以继续向下滚动页面。
我曾尝试使用 this post 中的解决方案,但它们似乎对我不起作用。解决方案中调用的unmousewheel();
函数在Flexslider JS中不存在。我也尝试了第二种解决方案,但它同时中断了滚动。
理想情况下,我希望使用外部函数修改 Flexslider JS,这样我就不会直接更改 Flexslider 代码。 Flexslider JS 会自动安装在我的开发和生产服务器中,并且不会在我的 git 存储库中进行跟踪。
我使用此自定义代码取得了一些成功。每次点击数组中的最后一张幻灯片时,我都可以触发 console.log 语句。我只是不确定如何使用它来获得我想要的东西。
(function ($,Drupal) {
console.log('function works');
Drupal.behaviors.my_custom_flexslider_behaviour = {
attach: function (context,settings) {
$('.flexslider').bind('end',function(e,slider) {
console.log('last slide');
});
}
};
})(jQuery,Drupal,this,this.document);
据我所知,这是在 Flexslider JS 中控制鼠标滚轮的原因:
// MOUSEWHEEL:
if (slider.vars.mousewheel) {
slider.bind('mousewheel',function(event,delta,deltaX,deltaY) {
event.preventDefault();
var target = (delta < 0) ? slider.getTarget('next') : slider.getTarget('prev');
slider.flexAnimate(target,slider.vars.pauseOnAction);
});
}
同样,我不确定如何附加解决方案。我对 JQuery/JS 的理解有限。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。