老外的一篇文章:http://www.javascriptkit.com/javatutors/onmousewheel.shtml
又有一篇呀,这个好呀:http://adomas.org/javascript-mouse-wheel/http://adomas.org/javascript-mouse-wheel/-------------还有fancybox插件对些有一个运用,单独的文件。
烈火网中有一篇像翻译过来的文章:http://www.liehuo.net/a/Demo/2010/mousewheel.html 演示:http://www.liehuo.net/a/Demo/2010/mousewheel.html
已经有针对jQuery的插件了 http://plugins.jquery.com/project/mousewheel
krpano中取消鼠标中键滚动动作的js:http://krpano.com/docu/html/swfobject15/swfobject/swfkrpanomousewheel.js
鼠标滚轮(滚动)事件:Mousewheel事件 http://www.cnblogs.com/aiyuchen/archive/2011/04/19/2020843.html
一段控制使鼠标中键滚动时,如果鼠标在flash对象上时取消滚动动作。
代码
function _onWheelScroll(event) {
if (event && event.target.tagName == 'EMBED')
event.preventDefault();
else if (window.event && window.event.srcElement.tagName == 'OBJECT')
window.event.returnValue = false;
}
if (!navigator.appVersion.match('Chrome') && window.addEventListener){ window.addEventListener('DOMMouseScroll', _onWheelScroll, false);
}else{
window.onmousewheel = document.onmousewheel = _onWheelScroll;
}
if (event && event.target.tagName == 'EMBED')
event.preventDefault();
else if (window.event && window.event.srcElement.tagName == 'OBJECT')
window.event.returnValue = false;
}
if (!navigator.appVersion.match('Chrome') && window.addEventListener){ window.addEventListener('DOMMouseScroll', _onWheelScroll, false);
}else{
window.onmousewheel = document.onmousewheel = _onWheelScroll;
}
2011-09-19 日 添加 方法 参考:http://help.dottoro.com/ljekedtv.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>鼠标滚动事件</title> <script type="text/javascript"> function MouseScroll (event) { var rolled = 0; if (event.wheelDelta) { rolled = event.wheelDelta/120; } else { // Firefox // The measurement units of the detail and wheelDelta properties are different. rolled = -event.detail/3; } var info = document.getElementById ("info"); info.innerHTML = rolled; event.preventDefault&&event.preventDefault(); return false; } function Init () { // for mouse scrolling in Firefox var elem = document.getElementById ("myDiv"); if (elem.addEventListener) { // all browsers except IE before version 9 // Internet Explorer, Opera, Google Chrome and Safari elem.addEventListener ("mousewheel", MouseScroll, false); // Firefox elem.addEventListener ("DOMMouseScroll", MouseScroll, false); } else { if (elem.attachEvent) { // IE before version 9 elem.attachEvent ("onmousewheel", MouseScroll); } } } </script> </head> <body onload="Init ();"> <div style="margin:20px; padding:20px; border:20px solid #FFC; height:1500px;"> <div id="myDiv" style="500px; height:500px; background-color:#CCC; border:10px dashed #000; margin:50px auto; padding:50px;"> The last roll amount: <span id="info" style="background-color:#e0e0d0; font-size:36px;"></span> </div> </div> </body> </html>
The last roll amount: