鼠标滚动兼容

2018-09-18 06:37:05来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

滚轮事件
onmousewheel
 (event.wheelDelta<0:滚轮向下,event.wheelDelta>0:滚轮向上)
【firefox不支持】

DOMMouseScroll(使用addEventListener事件绑定)
 (event.detail < 0:滚轮向上,event.detail > 0:滚轮向下)
【firefox支持方法】

滚轮事件兼容写法:
function mouseWheelFn(element, upFn, downFn){
   element.onmousewheel = fn;
   if(window.addEventListener){
        element.addEventListener("DOMMouseScroll", fn, false);
   }
   function fn(e){
            var e = e || window.event;
            // 判断滚轮方向(向上)
        if(e.wheelDelta > 0 || e.detail < 0){
            upFn();
        }else{
            downFn();
        }
        // 阻止冒泡
        e.cancelBubble = true;
        e.stopPropagation();
    }
}    

  

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:vue axios数据请求get、post方法的使用

下一篇:Javascript数组系列一之栈与队列