Owl Carousel 2 mousewheel slider

Question

Is there an option to scroll only one of the owl-carousel sliders on mousewheel? When i click the prev or next btn it's slides only the current carousel but on mousewheel slides all!

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

Well, In your code owl = $('.owl-carousel') is grabbing all the nodes with class owl-carousel. Thus when mousewheel event happens, causes scrolling of all the slides. So you need to give reference to the currently focused slider and trigger events only of that slider. Hope this fixes your issue. jsfiddle