最新のブラウザのマウスホイールイベント

Question

私はマウスホイールイベントのためのきれいで素敵なJavaScriptを用意しています.JSフレームワークなしで、古くなったバージョンのレガシーコードのない一般的なブラウザの最新バージョンのみをサポートしています。

マウスホイールイベントはうまく説明されています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)