आधुनिक ब्राउज़रों में मूसहेल इवेंट

Question

मैं मूसहेल इवेंट के लिए स्वच्छ और अच्छी जावास्क्रिप्ट रखना चाहता हूं, बिना किसी जेएस फ्रेमवर्क के अप्रचलित संस्करणों के लिए विरासत कोड के बिना सामान्य ब्राउज़र के नवीनतम संस्करण का समर्थन करना चाहता हूं।

मूसहेल घटना अच्छी तरह से here समझाया गया है। ब्राउज़र के मौजूदा नवीनतम संस्करणों के लिए इसे सरल कैसे बनाएं?

मेरे पास इसका परीक्षण करने के लिए सभी ब्राउज़रों तक पहुंच नहीं है, इसलिए caniuse.com मेरे लिए एक बड़ी मदद है। हां, मूसहेल का उल्लेख नहीं किया गया है।

डेरेक की टिप्पणी के आधार पर, मैंने यह समाधान लिखा था। क्या यह सभी ब्राउज़रों के लिए मान्य है?

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

Answer 1

यहाँ एक लेख है कि इस का वर्णन करता है, और एक उदाहरण देता है:

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

प्रासंगिक कोड, शून्य से विशिष्ट उदाहरण एक छवि का आकार बदलने की दी गई:

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

माउसव्हील घटना गैर-मानक है, और MDN recommendwheel event है।

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