js鼠标滚轮事件兼容

来源:互联网 发布:网络用语2016最新 编辑:程序博客网 时间:2024/05/17 19:59

问题:

滚轮事件
* onmousewheel
* 不兼容火狐
*
* DOMMouseScroll
* 只支持火狐
*
* e.wheelDelta;(120的倍数)
* 记录滚动事件的方向
* 负值是往后拉
* 正值就是往前推
* 不支持火狐
*
* e.detail;(3的倍数)
* 记录滚动事件的方向
* 负值是往后拉
* 正值就是往前推
* 只支持火狐

**

兼容

**
1.添加事件,IE与主流浏览器兼容
2.滚轮事件,火狐与其他浏览器兼容
3.滚轮方向,火狐与其他浏览器兼容

mousewheel(document,function (e,d) {        if(d>0){            box.innerHTML +="拉近"+d        }else{            box.innerHTML +="推开"+d        }        return false;//清除默认事件    });    function mousewheel(obj,fn) {        function eFn(e) {            e = e || window.event;            /*var d = -e.wheelDelta/120||e.detail/3;            fn.call(this,e,d)*/            if(fn.call(this,e,-e.wheelDelta/120||e.detail/3)===false)!-[1,]?e.returnValue=false:e.preventDefault();//清除默认事件,不支持return false            //alert(fn.call(this,e,-e.wheelDelta/120||e.detail/3)===false)        }//document.onmousewheel===null,当为非火狐(IE,谷歌)为null        var eName = document.onmousewheel===null?"mousewheel":"DOMMouseScroll";        document.addEventListener?obj.addEventListener(eName,eFn):obj.attachEvent("on"+eName,eFn)    }