올빼미 회전 목마 2 마우스 휠 슬라이더

Question

마우스 휠의 올빼미 회전식 슬라이더 중 하나만 스크롤하는 옵션이 있습니까? 이전 또는 다음 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