如何在滚动 div 时禁用页面滚动答案

【问题标题】：How to disable page scroll while scrolling div如何在滚动 div 时禁用页面滚动
【发布时间】：2012-06-04 09:39:31
【问题描述】：

大家好，

当用户滚动 div（黑色方形滚动条）时，我在禁用页面滚动时遇到问题。当用户的鼠标在滚动 div 内（里面有图像）时，我需要禁用页面滚动。

我试过设置溢出：隐藏；到正文，但效果不佳（因为页面滚动条变灰/禁用）。

我使用 jScrollPane 作为块中的自定义滚动条。

【问题讨论】：

您能在上面的页面添加一个链接吗？或者添加与该页面相关的 HTML/CSS 代码。
对不起，我不能，因为它是一个私人项目。而且HTML+CSS+JS太大了。
无论如何，关键是有一个带有jscrollpane附加的块，并且在body上有一个常规的滚动条。
不用担心。这个带有 jScrollPane 的块是否位于 div 或 p 标签内？
尝试应用“溢出：隐藏；”在 div 标签中，而不是在正文中。

标签： jquery scrollbar jscrollpane

【解决方案1】：

我不知道这是否是您的解决方案（无论如何，您的问题现在已经过时了），但您可以试试这个：页面滚动发生在达到 div 的最大滚动时。我的解决方案是强制 div 永远不会达到这个最大滚动。

$(".scrollable").scroll(function(){
    var maxScrollTop = $(this)[0].scrollHeight - $(this).outerHeight();
    if($(this).scrollTop() == maxScrollTop){
        $(this).scrollTop(maxScrollTop - 1);
    }
});

这个技巧对我很有效。

【讨论】：