2013-05-26 4 views
4

Я работаю над приложением, и мне нужно отслеживать движение колеса мыши, но мои функции не работают, как я ожидаю в Internet Explorer. Он работает во всех других браузерах, но не в IE, какие-либо идеи о том, что я делаю неправильно?Событие mousewheel не работает, т.е.

JS ...

var request = true; 
var onMouseWheelSpin = function(event) { 
    if(request === true){ 
     request = false; 
     var nDelta = 0; 
     if (!event) { event = window.event; } 
     // cross-bowser handling of eventdata to boil-down delta (+1 or -1) 
     if (event.wheelDelta) { // IE and Opera 
      nDelta= event.wheelDelta; 
      if (window.opera) { // Opera has the values reversed 
       nDelta= -nDelta; 
      } 
     } 
     else if (event.detail) { // Mozilla FireFox 
      nDelta= -event.detail; 
     } 
     if (nDelta > 0) { 
      zoomFun(1, event); 
     } 
     if (nDelta < 0) { 
      zoomFun(-1, event); 
     } 
     if (event.preventDefault) { // Mozilla FireFox 
      event.preventDefault(); 
     } 
     event.returnValue = false; // cancel default action 
    } 
} 

var zoomFun = function(delta,e) { 
    if(delta > 0){ // zoom in 
     alert("In"); 
    }else{ // zoom out 
     alert("Out"); 
    } 
    request = true; 
} 

var setupMouseWheel = function(){ 
    // for mouse scrolling in Firefox 
    var elem = document.getElementById("zoom"); 
    if (elem.addEventListener) { // all browsers except IE before version 9 
     // Internet Explorer, Opera, Google Chrome and Safari 
     elem.addEventListener ("mousewheel", onMouseWheelSpin, false); 
     // Firefox 
     elem.addEventListener ("DOMMouseScroll", onMouseWheelSpin, false); 
    }else{ 
     if (elem.attachEvent) { // IE before version 9 
      elem.attachEvent ("onmousewheel", onMouseWheelSpin); 
     } 
    } 
} 

Я звоню setupMouseWheel функцию OnLoad в организме ака

<body onload="setupMouseWheel();"> 

Спасибо за помощь!

ответ

14

Чтобы послушать колесо мыши, лучше всего прослушать DOMMouseScroll, mousewheel и wheel. Последний из них - IE, и это единственный, который вы не слушаете.

Я также отметить, что JQuery имеет ярлык для связывания нескольких событий:

$(elem).on("DOMMouseScroll mousewheel wheel", onMouseWheelSpin); 

обновление: заметили, что если вы помечено это как JQuery, вы на самом деле не использовать его. Чтобы сделать это без jQuery, просто продолжайте, как вы, но добавьте прослушиватель событий wheel, как и другие.

+0

ой и так как вы используете JQuery, вы должны использовать '$ (документ) .ready (функция () {blah}); 'вместо' onload' тела. Он менее подвержен влиянию другого кода на странице. – Dave

+0

Я пометил jquery, чтобы я мог расширить те, у кого могут быть другие решения, но я пытаюсь использовать javascript, когда он не добавляет слишком много кода. спасибо за информацию, плохо попробуйте сейчас –

+0

Ваш подход js и jquery на самом деле не исправили проблему в IE, но я нашел действительно отличный кросс-браузерный подход на сайте mozilla благодаря ответу +1 –

Смежные вопросы