禁用身体上的滚动

137

我想body完全禁用HTML上的滚动。我尝试了以下选项：

overflow: hidden; （不起作用，没有禁用滚动，它只是隐藏了滚动条）
position: fixed; （此方法有效，但它完全滚动到顶部，这对于此特定应用程序是不可接受的）

我无法找到这两个选项的替代方案，还有吗？

html css scroll

— 米查·维登曼（Micha Wiedenmann）
source

3

您将overflow：hidden用于哪个元素？

— Sajad Karuthedath'Feb 9'15

您到底想在这里实现什么？您的最终目标是什么？

— jbutler483

2

显示相关代码将更轻松地为您提供帮助。

— Sleek Geek 2015年

1

溢出：隐藏；是要走的路。如果它不起作用，则您的CSS中还有其他问题。尝试html，正文{overflow：hidden;}，如果这不起作用，请尝试* {overflow：hidden;}并尝试找出问题所在

— Jonas Grumann

245

设置height和overflow：

html, body {margin: 0; height: 100%; overflow: hidden}

http://jsfiddle.net/q99hvawt/

— 豹
source

3

2

当您具有固定位置的overlay元素时，无法在iOS上使用。

— notQ

1

您可以只添加“ overflow”：“ hidden”，它将正常工作。

— JPG

该解决方案对我而言并不立即起作用，但是在检查之后，“边距”在某个地方被覆盖。设置该元素的“ margin：0;” 做到了。

— joaoprib

19

如果body标签不执行任何操作，则HTML CSS效果很好

<body scroll="no" style="overflow: hidden">

在这种情况下，身体标签上应该有压倒一切，这很容易控制，但有时会带来头痛。

— 拉洛
source

21

这是无效的HTML5

— mbomb007 '18

@ mbomb007您能否在这里评论与HTML5相关的错误？

— 伊桑（Ethan）

5

@Ethan该scroll属性在<body>标签上无效。在我能找到的任何规格上，它都没有被列为有效。w3schools ; MDN ; Quackit

— mbomb007 '19

14

这篇文章很有帮助，但只是想分享一些可能对他人有帮助的替代方法：

设置max-height而不是height也可以解决问题。就我而言，我基于类切换禁用滚动。设置.someContainer {height: 100%; overflow: hidden;}容器的高度小于视口的高度时，将拉伸容器，这不是您想要的。设置max-height考虑了这一点，但是如果内容更改时容器的高度大于视口的高度，则仍将禁用滚动。

— 乔布乔
source

这为台式机浏览器节省了我的一天，而没有不必要的scroll-top-top副作用。但不适用于移动浏览器（iphone5s和android）。

— 鲍勃

5

为此，请在<body>元素上添加2个CSS属性。

body {
   height: 100%;
   overflow-y: hidden;
}

如今，有许多新闻网站要求用户创建帐户。通常，他们将提供对页面的完全访问权限大约一秒钟，然后显示一个弹出窗口，并阻止用户向下滚动。

— 视频数据库
source

这将隐藏滚动条。但是，问题是专门要求隐藏滚动条的替代方法

— DataGeek

@DataGeek，这不仅隐藏滚动条，而且还停止向下滚动的功能。据我了解，这就是所要的。即不仅隐藏它，还使其无法向下滚动。

— bvdb