I would like to disable scrolling on the HTML body completely. I have tried the following options:
我想完全禁用HTML主体上的滚动。我尝试了以下选项：
-
overflow: hidden;(not working, did not disable scrolling, it just hid the scrollbar)溢出：隐藏; （不工作，没有禁用滚动，它只是隐藏滚动条）
-
position: fixed;(this worked, but it scrolled completely to the top, which is unacceptable for this specific application)位置：固定; （这个工作，但它完全滚动到顶部，这对于这个特定的应用是不可接受的）
I was unable to find any alternatives to these two options, are there any more?
我无法找到这两个选项的替代方案，还有吗？
3 个解决方案
#1
97
Set height and overflow:
设置高度和溢出：
html, body {margin: 0; height: 100%; overflow: hidden}
http://jsfiddle.net/q99hvawt/
#2
7
HTML css works fine if body tag does nothing you can write as well
HTML css工作正常，如果body标签也没有什么可以写的
<body scroll="no" style="overflow: hidden">
In this case overriding should be on the body tag, it is easier to control but sometimes gives headaches.
在这种情况下，覆盖应该在身体标签上，它更容易控制，但有时会让人头疼。
#3
6
This post was helpful, but just wanted to share a slight alternative that may help others:
这篇文章很有帮助，但只是想分享一个可以帮助他人的轻微替代方案：
Setting max-height instead of height also does the trick. In my case, I'm disabling scrolling based on a class toggle. Setting .someContainer {height: 100%; overflow: hidden;} when the container's height is smaller than that of the viewport would stretch the container, which wouldn't be what you'd want. Setting max-height accounts for this, but if the container's height is greater than the viewport's when the content changes, still disables scrolling.
设置max-height而不是height也可以。在我的情况下，我基于类切换禁用滚动。设置.someContainer {height：100％; overflow：hidden;}当容器的高度小于视口的高度时，会拉伸容器，这不是你想要的。设置max-height会占用此值，但如果容器的高度大于内容更改时的视口，则仍会禁用滚动。
#1
97
Set height and overflow:
设置高度和溢出：
html, body {margin: 0; height: 100%; overflow: hidden}
http://jsfiddle.net/q99hvawt/
#2
7
HTML css works fine if body tag does nothing you can write as well
HTML css工作正常，如果body标签也没有什么可以写的
<body scroll="no" style="overflow: hidden">
In this case overriding should be on the body tag, it is easier to control but sometimes gives headaches.
在这种情况下，覆盖应该在身体标签上，它更容易控制，但有时会让人头疼。
#3
6
This post was helpful, but just wanted to share a slight alternative that may help others:
这篇文章很有帮助，但只是想分享一个可以帮助他人的轻微替代方案：
Setting max-height instead of height also does the trick. In my case, I'm disabling scrolling based on a class toggle. Setting .someContainer {height: 100%; overflow: hidden;} when the container's height is smaller than that of the viewport would stretch the container, which wouldn't be what you'd want. Setting max-height accounts for this, but if the container's height is greater than the viewport's when the content changes, still disables scrolling.
设置max-height而不是height也可以。在我的情况下，我基于类切换禁用滚动。设置.someContainer {height：100％; overflow：hidden;}当容器的高度小于视口的高度时，会拉伸容器，这不是你想要的。设置max-height会占用此值，但如果容器的高度大于内容更改时的视口，则仍会禁用滚动。