封装得滚轮事件,兼容方法。。。拿去用吧

 var 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.mozHidden !== 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);

封装得滚轮事件,兼容方法。。。拿去用吧

时间: 2024-12-25 19:18:53

封装得滚轮事件,兼容方法。。。拿去用吧的相关文章

动手封装一个滚轮事件吧!

/*滚轮事件函数封装*/ Object.prototype.onmousewheelhandlefun=function(handle){ var info=navigator.userAgent; var down=null; if(info.indexOf("Firefox")!=-1){ this.addEventListener("DOMMouseScrool",funciton(event){ var ev=event||window.event; if(

【学】鼠标滚轮事件兼容写法

鼠标滚轮的写法要注意以下几个知识点: ie,chrome下有onmousewheel事件,而ff是DOMMouseScroll事件,而且只能通过addEventListener来添加,而同时为了兼顾ie9下面所以在事件添加的时候就要做判断 为了判断是向上还是向下滚动,ie和chrome下是通过event事件对象的wheelDelta属性来判断,而ff下是event的detail值判断,但由于向上和向下滚动对应的正负关系,wheelDelta和detail正好是相反的,那可以直接通过正负值来判断滚

1.图片放大方法+2.中间菜单栏位置随滚轮移动固定方法3.去外层虚线方法

<a></a>去外层虚线方法:a:focus{outline:none;-moz-outline:none;} 图片放大方法1: <style type="text/css"> .xt{ width:230px; height:230px;} .tp{ width:230px; height:230px; overflow:hidden;} .tp img{transition:all 1s ease-out 0s; margin-left:0px;

鼠标滚轮事件---兼容

鼠标滚轮事件绑定及滚轮方向兼容demo <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ margin: 0; padding: 0; } #test{ width: 200px; height: 200px; background: pink

鼠标滚轮事件---兼容火狐

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <style> 7 *{ 8 margin:0; 9 padding:0; 10 } 11 html,body{ 12 width:100%; 13 height:100%; 14 positi

一些web事件兼容(根据高级程序)

var EventUtil = { //事件监听 addHandler: function( element, type, handler ) { if ( element.addEventListener ) { element.addEventListener(type, handler, false); } else if ( element.attachEvent ) { element.attachEvent("on" + type, handler); } else { e

两种js监听滚轮事件的方式

前段时间在写前端的时候,需要监听浏览器的滚轮事件 网上查了一下,找到两种监听滚轮事件的方法: 一.原生js通过window.onscroll监听 //监听并注册匿名函数window.onscroll = function() { //为了保证兼容性,这里取两个值,哪个有值取哪一个 var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; //scrollTop就是触发滚轮事件时滚轮的高度 } 二.

jquery 兼容的滚轮事件

1 // jquery 兼容的滚轮事件 2 $(document).on("mousewheel DOMMouseScroll", function (e) { 3 var delta = (e.originalEvent.wheelDelta && (e.originalEvent.wheelDelta > 0 ? 1 : -1)) || // chrome & ie 4 (e.originalEvent.detail && (e.ori

图片放大方法、、滚动条位置随滚轮移动固定方法、、&lt;a&gt;&lt;/a&gt;去外层虚线方法:a:focus { outline:none; -moz-outline:none;};

图片放大方法: <style type="text/css">.xt{ width:230px; height:230px;}.tp{ width:230px; height:230px; overflow:hidden;}.tp img{transition:all 1s ease-out 0s; margin-left:0px; margin-top:0px; perspective-origin:bottom;}</style> <body>