Evento della rotellina del mouse nei browser moderni

Question

Mi piacerebbe avere un JavaScript pulito e piacevole per l'evento mousewheel, supportando solo l'ultima versione di browser comuni senza codice legacy per versioni obsolete, senza alcun framework JS.

L'evento della rotellina del mouse è spiegato correttamente here. Come semplificarlo per le attuali versioni più recenti dei browser?

Non ho accesso a tutti i browser per testarlo, quindi caniuse.com mi è di grande aiuto. Ahimè, la ruota del mouse non è menzionata lì.

Sulla base del commento di Derek, ho scritto questa soluzione. È valido per tutti i browser?

someObject.addEventListener("onwheel" in document ? "wheel" : "mousewheel", function(e) { 
    e.wheel = e.deltaY ? -e.deltaY : e.wheelDelta/40; 
    // custom code 
}); 

Answer 1

Ecco un articolo che descrive questa, e dà un esempio:

http://www.sitepoint.com/html5-javascript-mouse-wheel/

relativo codice, meno l'esempio specifico data di ridimensionamento di un'immagine:

var myitem = document.getElementById("myItem"); 
if (myitem.addEventListener) 
{ 
    // IE9, Chrome, Safari, Opera 
    myitem.addEventListener("mousewheel", MouseWheelHandler, false); 
    // Firefox 
    myitem.addEventListener("DOMMouseScroll", MouseWheelHandler, false); 
} 
// IE 6/7/8 
else 
{ 
    myitem.attachEvent("onmousewheel", MouseWheelHandler); 
} 

function MouseWheelHandler(e) 
{ 
    // cross-browser wheel delta 
    var e = window.event || e; // old IE support 
    var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail))); 

    return false; 
} 

Answer 2

la rotellina del mouse l'evento non è standard e MDN recommend il wheel event.

var item = document.getElementById('item') 
item.addEventListener('mousewheel', function(e) { 
    console.log('event', e) 
}, false)