IE、Safari、 Opera 、chrome是mousewheel事件,Firefox是DOMMouseScroll事件。事件属性方面,IE等是 event.detail,Firefox是event. wheelDelta。IE等往上滚一圈为120,往下滚一圈为-120。Firefox往上滚一圈为-3,往下滚一圈为3。我们可以构造一个函数来削除 它们的差异。
var mouseScroll = function(fn){ var roll = function(){ var delta = 0, e = arguments[0] || window.event; delta = (e.wheelDelta) ? e.wheelDelta / 120 : -(e.detail || 0) / 3; fn(delta);//回调函数中的回调函数 } if(window.netscape ){ document.addEventListener('DOMMouseScroll', roll, false); }else{ document.onmousewheel = roll; } }
此函数接受一函数作为参数,如:
mouseScroll(function(delta){ var obj = document.getElementById('scroll'), current = parseInt(obj.offsetTop)+(delta*10); obj.style.top = current+"px"; });