交叉broswer支持 - 鼠标滚动控制下一个/上一个Bootstrap轮播幻灯片

Question

我找到了一个我想要使用的示例，但我不确定如何为Bootstrap轮播控件调整此代码。 https://www.sitepoint.com/html5-javascript-mouse-wheel/

我正在使用下面的代码，但它仅适用于Chrome，因此我希望将其与其他代码一起使用。我认为这将是直截了当的，但我的尝试没有奏效。

$('.carousel').bind('wheel', function(e){
   if(e.originalEvent.deltaY > 50) {
      $(this).carousel('next');
   }
   else if (e.originalEvent.deltaY < -50) {
      $(this).carousel('prev');
   }
});

------- -------- UPDATE

我在另一个在不同浏览器上运行良好的线程中找到了答案：mousewheel event is not triggering in firefox browser

以下是适合我需要的代码，鼠标滚动控制我的Bootstrap 3 Carousel上的下一张/上一张幻灯片。希望能帮助任何人！

$(window).on('wheel', function(event){
// deltaY obviously records vertical scroll, deltaX and deltaZ exist too


if(event.originalEvent.deltaY > 50){
   // wheeled down
   $('.carousel').carousel('next')

}
else if(event.originalEvent.deltaY < -50) {
    // wheeled up
    $('.carousel').carousel('prev')
}

return false; //to disable page scrolling
});

Answer 1

找到答案并更新了我原来的帖子。