禁用网页上的所有滚动答案

【问题标题】：Disable all scrolling on webpage禁用网页上的所有滚动
【发布时间】：2013-07-11 15:03:23
【问题描述】：

我想知道是否可以禁用网页上的所有滚动。

我正在使用

html, body { overflow:hidden; }

问题是这在 iOS 设备上不起作用，如果你按住鼠标滚轮并向下拖动它也可以滚动，所以这似乎是一个非常糟糕的问题解决方案

有没有办法在所有设备上禁用所有滚动方法，然后重新启用它？

【问题讨论】：

不要添加溢出页面的内容...？！更多的上下文和用例会在这里有所帮助。
这是否可行，但我会尝试添加一个覆盖视口的透明覆盖 div。在 iOS 上拖动可能会尝试滚动该 div，这不会做任何事情。
试试这个：* {溢出：隐藏； }
有页面加载询问您是否年满 21 岁。它是单页设计，这意味着所有内容一次加载。我只是想尽我最大的努力阻止用户在他们同意他们年满 21 岁之前访问该网站。
我建议不要显示任何内容，有一个年龄网关页面...

标签： javascript jquery ios css html

【解决方案1】：

我遇到了同样的问题，我用以下方法解决了它；

var disableScroll = false;
var scrollPos = 0;
function stopScroll() {
    disableScroll = true;
    scrollPos = $(window).scrollTop();
}
function enableScroll() {
    disableScroll = false;
}
$(function(){
    $(window).bind('scroll', function(){
         if(disableScroll) $(window).scrollTop(scrollPos);
    });
    $(window).bind('touchmove', function(){
         $(window).trigger('scroll');
    });
});

触摸移动绑定到窗口，因为在触摸移动完成之前不会触发窗口滚动事件，因此这可以在 iOS 上提供更流畅的体验！

这不是一个完美的解决方案，因为您可以“投掷”页面，但在投掷完成后它将返回到所需位置（因为随后将触发窗口滚动事件）。这是因为 iOS 浏览器为了性能而去掉了很多事件。当页面被抛出时，setTimeout 和 setInterval 函数也不会触发，循环也不是一个选项！

看这里http://jsfiddle.net/8T26k/

【讨论】：

非常感谢，我做了一些修改，比如将data-disabled="true" 添加到正文标签，并在用户需要滚动时更新它。这正如我所期望的那样工作。非常感谢您的回复。