jQuery禁用滚动鼠标在绝对div

前端之家收集整理的这篇文章主要介绍了jQuery禁用滚动鼠标在绝对div前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图禁用窗口鼠标滚动功能,当鼠标悬停在div – 所以只有div滚动启用 – 当鼠标移动离开div – 滚动到窗口再次应用。 div是绝对定位的。

我看到这个帖子use jquery to disable mouse scroll wheel function when the mouse cursor is inside a div?,但它似乎并没有提供任何答案 – 因此我的问题。

我假设它会是这样的东西(如果只有这些方法存在):

$('#container').hover(function() {
     $(window).scroll().disable();
     $(this).scroll().enable();
},function() {
     $(window).scroll().enable();
});@H_502_7@

解决方法

这是一个流行的问题,所以我更新,概述这里提供的答案,这可能是最好的。有三个独特的解决方案。两个来自阿莫斯,一个来自我自己。然而,每个操作不同。

> Amos – 设置溢出:隐藏在身上。这是简单和工作伟大。但主窗口的滚动条将闪烁。
> Amos – 使用javascript来禁用鼠标滚轮。这是伟大的,如果你不需要摩擦轮。
>这个答案 – 使用javascript只滚动你的元素。这是最好的答案,如果你的内部div需要滚动,但你不想要任何其他div滚动。示例小提琴展示了这一点。

http://jsfiddle.net/eXQf3/371/

代码工作如下:

>捕获当前元素上的滚动事件
>取消滚动事件
>仅手动滚动当前元素

$('#abs').bind('mousewheel DOMMouseScroll',function(e) {
    var scrollTo = null;

    if (e.type == 'mousewheel') {
        scrollTo = (e.originalEvent.wheelDelta * -1);
    }
    else if (e.type == 'DOMMouseScroll') {
        scrollTo = 40 * e.originalEvent.detail;
    }

    if (scrollTo) {
        e.preventDefault();
        $(this).scrollTop(scrollTo + $(this).scrollTop());
    }
});​@H_502_7@ 
 

更改日志:

> FF支持> scrollTo null检查以恢复为默认行为,以防万一发生意外事件>支持jQuery 1.7。

猜你在找的jQuery相关文章