鼠标滚轮事件

使用js对鼠标滚轮事件进行控制,滚轮事件其中考虑浏览器兼容性问题
其中火狐浏览器事件为:"DOMMousescroll";其余浏览器是:"onmousewheel"
onmousewheel事件在火狐浏览器中为:"null";
滚轮事件绑定:

//事件绑定
    function addEvent(obj,sEv,fn){
        if(obj.addEventListener){ 
  // addEventListener(高级浏览器)
            obj.addEventListener(sEv,fn,false);
        }else{
  // attachEvent(iE8-使用)
            obj.attachEvent('on'+sEv,fn);   
        }
    }
//阻止默认行为
 function preventDefault(ev){
        var oEvent = ev || event;
    if(ev.preventDefault){
        ev.preventDefault();
    }else{
        ev.returnValue = false;
    }
//滚轮事件
function addWheel(obj,fn){
    if(obj.onmousewheel === null){
        addEvent(obj,'DOMMouseScroll',wheel);
    }else{
        addEvent(obj,'mousewheel',wheel);
    }
    function wheel(ev){
        var oEvent = ev || event;
        var bDown = oEvent.wheelDelta ? oEvent.wheelDelta<0 : oEvent.detail>0;fn && fn(bDown);
            preventDefault(ev);
    }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 鼠标滚轮事件有兼容性的问题,主要是firfox和其他浏览器的差异,以下就这两种情况分开说明: 其他浏览器 事件名称...
    llpy阅读 2,695评论 0 1
  • 通过一个小例子来介绍鼠标的滚轮事件,通过鼠标向上滚动来放大图片,向下滚动来缩小图片下面是HTML文档 下面是封装的...
    likeli阅读 1,943评论 1 1
  • 事件流 IE和Netscape开发团队提出了完全相反的两种事件流的概念,事件冒泡流和事件捕获流。 事件冒泡 事件由...
    exialym阅读 4,547评论 0 9
  • 简书是一款可以写作的社交软件,我注册了好多天,一直没敢动笔,原因有二,其一,我有自知之明,知道自己就那么半桶...
    榆笛阅读 3,998评论 16 6