美文网首页
滑轮滚动穿透问题

滑轮滚动穿透问题

作者: 秃头大叔 | 来源:发表于2018-08-28 20:46 被阅读0次

    滑轮滚动穿透问题

    在弹层中若弹框内容过长自带滚动条,在滚动时body内容同样会滚动

    $.fn.scrollUnique = function() {
          return $(this).each(function() {
            var eventType = "mousewheel";
            // navigator.userAgent.indexOf(“Firefox”) > -1
            // document.mozHidden !== undefined
            if (navigator.userAgent.indexOf("Firefox") > -1) {
              eventType = "DOMMouseScroll";
            }
            // console.log(eventType)
            $(this).on(eventType, function(event) {
              // 一些数据
              var scrollTop = this.scrollTop,
                scrollHeight = this.scrollHeight,
                height = this.clientHeight;
              var delta = event.originalEvent.wheelDelta
                ? event.originalEvent.wheelDelta
                : -(event.originalEvent.detail || 0);
            //  if ( (delta > 0 && scrollTop <= 0) || (delta < 0 && scrollTop + height >= scrollHeight)) {
                if ((delta > 0 && scrollTop <= delta) || (delta < 0 && scrollHeight - height - scrollTop <= -1 * delta)) {  //原来的
                // 向上滚 || 向下滚
                // event.preventDefault();
                var e = window.event || event;
                if (e.stopPropagation) {
                  e.stopPropagation();
                } else {
                  e.cancelBubble = true;
                }
                if (e.preventDefault) {
                  e.preventDefault();
                } else {
                  e.returnValue = false;
                }
              }
            });
          });
        };
        $(".modal .easy-scrollbar__wrap").scrollUnique();
    

    相关文章

      网友评论

          本文标题:滑轮滚动穿透问题

          本文链接:https://www.haomeiwen.com/subject/kztcwftx.html