zoukankan      html  css  js  c++  java
  • 阻止网页内部滚动条mousewheel事件冒泡

    利用鼠标滚轮对网页内部无素滚动条触发滚动事件,当滚动条到达元素顶部或底部时不触发浏览器窗口的滚动事件。

    通过调用以下函数实现:

    function preventScroll(id){  
        var _this = document.getElementById(id);  
        if(navigator.userAgent.indexOf("Firefox")>0){  
            _this.addEventListener('DOMMouseScroll',function(e){  
                _this.scrollTop += e.detail > 0 ? 60 : -60;     
                e.preventDefault();  
            },false);   
        }else{  
            _this.onmousewheel = function(e){     
                e = e || window.event;     
                _this.scrollTop += e.wheelDelta > 0 ? -60 : 60;     
                return false;  
            };  
        }  
        return this;  
    }  

    参考资料:http://www.cnblogs.com/weekend001/archive/2011/05/11/2043474.html 

    IE9不支持类似 e.returnValue = false  这种写法,相应的地方改成return false即可。

    jquery插件:

    $.fn.extend({
        "preventScroll": function () {//阻止滚动
            $(this).each(function () {
                var _this = this;
                if (navigator.userAgent.indexOf('Firefox') >= 0) {   //firefox  
                    _this.addEventListener('DOMMouseScroll', function (e) { e.preventDefault(); }, false);
                } else {
                    _this.onmousewheel = function (e) {
                        return false;
                    };
                }
            })
        },
        "areaScroll": function () {//区域防止冒泡滚动
            $(this).each(function () {
                var _this = this;
                if (navigator.userAgent.indexOf('Firefox') >= 0) {   //firefox  
                    _this.addEventListener('DOMMouseScroll', function (e) {
                        _this.scrollTop += e.detail > 0 ? 60 : -60;
                        e.preventDefault();
                    }, false);
                } else {
                    _this.onmousewheel = function (e) {
                        e = e || window.event;
                        _this.scrollTop += e.wheelDelta > 0 ? -60 : 60;
                        return false;
                    };
                }
            })
        }
    });
  • 相关阅读:
    iis6 , URL重写HTM文件名后,出现真实的HTM文件不能访问的解决
    pe如何安装ios系统
    ASP.NET Word转为PDF
    asp.net 操作word 权限
    windows server 2008 r2 修改远程登入的端口号(3389)
    A
    A Bug
    亲戚
    Kruskal
    HDOJ ——统计难题
  • 原文地址:https://www.cnblogs.com/GoCircle/p/8393913.html
Copyright © 2011-2022 走看看