Owl Carousel 2 鼠标滚轮滑块

Question

是否可以选择在鼠标滚轮上仅滚动 owl-carousel 滑块之一？当我点击上一个或下一个 btn 时，它只滑动当前轮播，但在鼠标滚轮上滑动全部！

HTML

<div class="owl-carousel">
   <div class="item">
      item
   </div>
   <div class="item">
      item
   </div>
   <div class="item">
      item
   </div> 
</div>

JS

$('.owl-carousel').owlCarousel({
   loop: true,
   margin: 30,
   nav: true, 
   responsiveClass: true,
   responsive: {
      0: {
         items: 1 
      },
      600: {
         items: 2 
      },
      1000: {
         items: 3
      }
   }
});
var owl = $('.owl-carousel');
owl.on('mousewheel', '.owl-stage', function(e) {
   if (e.deltaY > 0) {
      owl.trigger('next.owl');
   } else {
      owl.trigger('prev.owl');
   }
   e.preventDefault();
});

jsfiddle

Answer 1

好吧，在你的代码中 owl = $('.owl-carousel') 是用 class owl-carousel 抓取所有节点。因此，当 mousewheel 事件发生时，会导致所有幻灯片滚动。因此，您需要引用当前聚焦的滑块并仅触发该滑块的事件。希望这可以解决您的问题。 jsfiddle

Owl Carousel 2 鼠标滚轮滑块

Owl Carousel 2 mousewheel slider

javascript

jquery

owl-carousel-2