My application requires tracking mouse wheel movement, but the functions I've written aren't working properly in Internet Explorer. They work fine in all other browsers except IE. Any suggestions on what might be causing this issue?
JS...
var request = true;
var onMouseWheelSpin = function(event) {
if(request === true){
request = false;
var nDelta = 0;
if (!event) { event = window.event; }
// Cross-browser handling of event data to determine delta (+1 or -1)
if ( event.wheelDelta ) { // For IE and Opera
nDelta= event.wheelDelta;
if ( window.opera ) { // Opera has the values reversed
nDelta= -nDelta;
}
}
else if (event.detail) { // For Mozilla FireFox
nDelta= -event.detail;
}
if (nDelta > 0) {
zoomFun( 1, event );
}
if (nDelta < 0) {
zoomFun( -1, event );
}
if ( event.preventDefault ) { // For 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
// For Internet Explorer, Opera, Google Chrome, and Safari
elem.addEventListener ("mousewheel", onMouseWheelSpin, false);
// For Firefox
elem.addEventListener ("DOMMouseScroll", onMouseWheelSpin, false);
}else{
if (elem.attachEvent) { // For IE Before version 9
elem.attachEvent ("onmousewheel", onMouseWheelSpin);
}
}
}
I am calling the setupMouseWheel function onload in the body as:
<body onload="setupMouseWheel();">
Thank you for your assistance!