Question

我真的很难过。我直接从猫头鹰轮播网站（here）复制了鼠标滚轮代码。我唯一改变的是id＆amp;变量名，所以我可以有两个独立滚动的轮播。

问题是，滚动只调用prev.owl而不是next.owl。我有一个小提琴here。（我知道html中的所有内容都有问题，但对于我的网站，它必须是这样的）。

非常感谢任何帮助！

鼠标滚轮代码：

(document).ready(function(){
$(".owl-carousel").owlCarousel();
});

var owl1= $('#c1');
owl1.owlCarousel({
    loop:true,
    nav:true,
    margin:10,
    responsive:{
         0:{
            items:1
         },
         600:{
            items:3
         },
         960:{
            items:5
         },
         1200:{
            items:6
         }
     }
};
owl1.on('mousewheel', '.owl-stage', function(e){
     if(e.deltaY>0){
         owl1.trigger('next.owl');
     } else {
         owl1.trigger('prev.owl');
     }
     e.preventDefault();
});

Answer 1

不知道为什么，但是这段代码确实可以帮助我解决此问题。

owl[0].addEventListener('mousewheel', e => {
    if (e.deltaY > 0) {
      $('.owl-carousel').trigger('next.owl');
    } else {
      $('.owl-carousel').trigger('prev.owl');
    }
    e.preventDefault();
  }, false);

Mousewheel Scroll Only Calling Previous

1 个答案: