2017-06-15 11 views
0

私のウェブサイトでは、ブートストラップの回転スライダーを使用しています。私はマウスのスクロールでスライダーが変わる

は、マウスホイールをスクロールするとき、これは、カルーセルの変更を行います
 <script> 
    $(document).ready(function() { 
     $("#product_slider").owlCarousel({ 
     rtl:true, 
     loop:true,               
     margin:4, 
     autoplay:false, 
     autoplayTimeout:10000, 
     autoplayHoverPause:true, 
     lazyLoad : true, 
     pagination:false, 
     nav:true, 
      dots: false, 
     navText:false , 
     responsive:{ 
     0:{ 
      items:1 
     }, 
     500:{ 
      items:1 
     }, 
     768:{ 
      items:4 
     }, 
     1200:{ 
      items:5 

     } 
     } 
     }); 

    }); 
</script> 

答えて

0

これは私のコードである私にできることthis.thisコードが正常に動作しますが、私はmouseScroll 上のスライドを変更したいスライドがmouseScroll.howに変更したいですその上。あなたのマウスがカルーセルに乗っている間、ページ全体がスクロールするのを防ぐのが賢明だと思いますが、ここでそれをする時間は取っていません。
フィドルhttps://jsfiddle.net/mikeferrari/z34m1wbo/

// select the carousel container 
var myelement = document.getElementById("myCarousel"); 

// this function is called every time the mouse wheel is scrolled 
function makeItSo() { 
    // this is where you tell it to go to the next slide 
    $('.carousel').carousel('next') 
} 

myelement.addEventListener('wheel', function(e) {  
    makeItSo(); 
}); 


// start your carousel on page load 
$('.carousel').carousel({ 
    interval: 2000 
}) 
+0

が、それはエラーを示しています – user94

+1

はあなたのコードに一致するように、それを変更した「キャッチされない例外TypeError。$(...)カルーセルは関数ではありませんか」?サンプルコードのmyCarouselをセレクタの.owlCarouselに置き換える必要があります –

関連する問題