zoukankan      html  css  js  c++  java
  • js滚轮事件兼容写法

    /**
     * 简易的事件添加方法
     */
     
    define(function(require, exports, module) {
        exports.addEvent = (function(window, undefined) {        
            var _eventCompat = function(event) {
                var type = event.type;
                if (type == 'DOMMouseScroll' || type == 'mousewheel') {
                    event.delta = (event.wheelDelta) ? event.wheelDelta / 120 : -(event.detail || 0) / 3;
                }
                //alert(event.delta);
                if (event.srcElement && !event.target) {
                    event.target = event.srcElement;    
                }
                if (!event.preventDefault && event.returnValue !== undefined) {
                    event.preventDefault = function() {
                        event.returnValue = false;
                    };
                }
                /* 
                   ......其他一些兼容性处理 */
                return event;
            };
            if (window.addEventListener) {
                return function(el, type, fn, capture) {
                    if (type === "mousewheel" && document.mozFullScreen !== undefined) {
                        type = "DOMMouseScroll";
                    }
                    el.addEventListener(type, function(event) {
                        fn.call(this, _eventCompat(event));
                    }, capture || false);
                }
            } else if (window.attachEvent) {
                return function(el, type, fn, capture) {
                    el.attachEvent("on" + type, function(event) {
                        event = event || window.event;
                        fn.call(el, _eventCompat(event));    
                    });
                }
            }
            return function() {};    
        })(window);        
    });
    

      于是,我们就可以很从容使用mousewheel事件了。例如:

    addEvent(dom, "mousewheel", function(event) {
        if (event.delta < 0) { alert("鼠标向上滚了!"); }
    });
    

      

  • 相关阅读:
    docker 打包镜像并传输
    bytes函数——字节
    python——多线程
    Golang基础——随机数rand.Seed
    Golang基础——数据类型:数组
    property 和 setter 装饰器
    qrc文件使用
    SQL优化——索引
    mysql结构及存储引擎
    css样式重置以及定位
  • 原文地址:https://www.cnblogs.com/holy-amy/p/9146657.html
Copyright © 2011-2022 走看看