在 Chrome 中禁用滚动答案

【问题标题】：Disable scroll in Chrome在 Chrome 中禁用滚动
【发布时间】：2015-11-19 11:06:12
【问题描述】：

我需要在 Chrome 上的 HTML 页面中禁用滚动。我写了溢出：隐藏，以便在 Firefox 和 Internet Explorer 中隐藏滚动条并禁用鼠标滚轮。仍然可以通过单击鼠标滚轮在 Firefox 中滚动，但我不在乎。

所以 overflow:hidden 只是隐藏了 Chrome 中的滚动条，但我们仍然可以使用鼠标滚轮滚动。

我制作了一个 JSFiddle here，但它会用他自己的滚动条抛出一些错误，所以我建议你创建这个简单的 html 脚本来尝试：

<html>
<head>
<style>
body{
overflow:hidden;
}

div{
height:2000px;
width:1300px;
position: relative;
background-image:linear-gradient(blue, red);
}
</style>
</head>
<body>
<div></div>
<span>Test</span>
</body>
</html>

那么我们如何禁用 chrome 中的滚动？仅供参考，我计划制作一个 Android 应用程序，这就是 Chrome 对我很重要的原因。

编辑：我的电脑上有 Chrome 错误，所以测试不好，但如果你有一个安卓系统，你可以导航到我的页面 here，你会注意到这个错误：你可以用手指滚动。

【问题讨论】：

我在 chrome 中检查过，没有任何问题..您使用的是哪个版本..您可以显示您的问题的屏幕截图
更新你的 chrome 版本就可以了
我有这个版本 28.0.1500.72 m，好像是最新的
@podelo 检查下面的代码...@abertil 它的工作原理是 yneeded rt

标签： html css google-chrome overflow

【解决方案1】：

如果单独使用overflow:hidden 不起作用，也只需使用窗口高度：

document.getElementById('yourDivId').style.height = window.innerHeight + 'px';

以下是在 Android Chrome 浏览器中禁用滚动的方法：

document.addEventListener('touchmove', function(evt) {
    evt.preventDefault();
});

当然你可以用document.removeEventListener再次启用它。

【讨论】：

【解决方案2】：

试试

更新

图片

HTML

<div  id="wrapper">

<div></div>
    </div>
<span>Test</span>

CSS：

#wrapper
{
    margin: 0 auto;
position: relative;
height:580px;
}

body {
    min-height: 580px;
    overflow: hidden;
}

div{
    height:2000px;
    width:1300px;
    position: relative;
    background-image:linear-gradient(blue, red);
}

html {
    overflow: auto;
}

【讨论】：

感谢您的回答，但它不起作用，而且它使滚动条可见
将包装器和主体最小高度更改为 580px
正如我在 jsfiddle 中所说的那样，它可以工作，但在带有 HTML 页面的真实浏览器中却不行
我在另一台电脑上试过，就像你说的那样有效。我不知道为什么在我的电脑上它不起作用。
如果它在另一台电脑和我的电脑上工作..那么问题就出在你的电脑上。