JavaScript中的鼠标滚轮事件详解

JavaScript中的鼠标滚轮事件详解 /*Firefox注册事件*/ if(document.addEventListener){ document.addEventListener('DOMMouseScroll',scrollFunc,false); } Safari与Chrome属于同一类型，可使用HTML DOM方式添加事件 window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome 其中除Firefox外其余均可使用HTML DOM方式添加事件，因此添加事件使用以下方式 /*注册事件*/ if(document.addEventListener){ document.addEventListener('DOMMouseScroll',scrollFunc,false); }//W3C window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome detail与wheelDelta 判断滚轮向上或向下在浏览器中也要考虑兼容性，现在五大浏览器(IE、Opera、Safari、Firefox、Chrome)中Firefox使用detail，其余四类使用wheelDelta;两者只在取值上不一致，代表含义一致，detail与wheelDelta只各取两个值，detail只取?3，wheelDelta只取?120，其中正数表示为向上，负数表示向下。

滚动值:(IE/Opera)

滚动值:(Firefox)

点击预览效果 Chrome Firefox IE(8) IE(6) Opera Safari 文章来源: