フクロウカルーセル2マウスホイールスライダー

Question

マウスホイールにあるフクロウカルーセルスライダーの1つだけをスクロールするオプションはありますか？ 前のまたは次の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')は、クラスowl-carouselを持つすべてのノードをつかんれます。したがって、mousewheelイベントが発生すると、すべてのスライドがスクロールします。したがって、現在フォーカスされているスライダへの参照を与え、そのスライダのイベントのみをトリガする必要があります。これで問題が解決されることを願っています。 jsfiddle