封装鼠标滚轮事件_mousewheel

            function mousewheel(obj,fn){
                
                obj.onmousewheel===null ? obj.onmousewheel=fun : obj.addEventListener('DOMMouseScroll',fun,false);
                
                function fun(e){
                    var e=e || event,
                        num=0;
                        
                    if(e.wheelDelta){
                        num=e.wheelDelta>0?1:-1;
                    }else{
                        num=e.detail<0?1:-1;
                    }
                    fn(num);
                    
                    if(e.preventDefault)e.preventDefault();
                    return false;
                }
            }

使用方法:

            var oDiv=document.getElementById('div');
            
            mousewheel(oDiv,function(dir){
                if(dir>0) alert('向上滚动');
                if(dir<0) alert('往下滚动');
            });

兼容性:ie6+吧(只测试了ie6+,chrome、Firefox)

注释一点点:

 ie/chrome: onmousewheel
   ev.wheelDelta:
      上:120
      下:-120
 
 ff: addEventListener('DOMMouseScroll',fn,false) 火狐用鼠标事件要用addEventListener绑定
  ev.detail:
     上:-3
     下:3
 
 阻止默认事件:
     return false 用于阻止一般形式的事件(如:on+事件名称)的默认行为
     ev.preventDefault() 用于阻止addEventListener绑定的事件的默认行为

原文地址:https://www.cnblogs.com/barrior/p/4092320.html