js页面无滚动条添加滚轮事件
Aug 13 , 2015

当页面无滚动条时,滑动滚轮时window.onscroll事件不会相应,此时要触发滚动事件的话要根据滚轮滚动方向主动去添加滚轮事件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var MouseWheelHandler=function(e){
e.preventDefault();
e=window.event||e;
var value;
if(e.wheelDelta)
value=e.wheelDelta;
else if(e.detail)
value=-e.detail;
}
var addMouseWheelHandler=function(){
if(document.attachEvent)
document.attachEvent('onmousewheel',MouseWheelHandler);
else if(document.addEventListener)
document.addEventListener('DOMMouseScroll',MouseWheelHandler,false);
else
document.addEventListener('mousewheel',MouseWheelHandler,false);
}
addMouseWheelHandler();
在IE、chrome、opera、safari、firefox中已测试chrome、ie、Firefox可用,
其中要注意的是,Firefox中是通过e.detail来判断滚轮方向,且e.detail=-3方向向上,e.detail=3方向向下
IE、chrome中通过e.wheelDelta判断滚轮方向,e.wheelDelta=120方向向上,e.wheelDelta=-120方向向下
但是,当页面有滚动条时要注意,原始的滚轮事件会失效

PREVIOUS NEXT
 |