我想完全禁用HTML主体上的滚动。我尝试了以下几种方法:
溢出:隐藏;(不工作,没有禁用滚动,它只是隐藏滚动条) 位置:固定;(这是工作,但它完全滚动到顶部,这是不可接受的这个特定的应用程序)
我找不到这两个选项之外的其他选项,还有吗?
我想完全禁用HTML主体上的滚动。我尝试了以下几种方法:
溢出:隐藏;(不工作,没有禁用滚动,它只是隐藏滚动条) 位置:固定;(这是工作,但它完全滚动到顶部,这是不可接受的这个特定的应用程序)
我找不到这两个选项之外的其他选项,还有吗?
当前回答
如果你不介意页面滚动到顶部的话。你可以:
position: fixed;
在你不想滚动的元素上。我知道这不是你想要的答案,但我直接回答了那些谷歌这个问题的人。
其他回答
设置高度和溢出:
html, body {margin: 0; height: 100%; overflow: hidden}
http://jsfiddle.net/q99hvawt/
HTML
<body id="appBody">
....
</body>
JS
function disableBodyScroll(){
const element = document.querySelector("#appBody");
element.classList.add("stop-scroll");
}
function enableBodyScroll(){
const element = document.querySelector("#appBody");
element.classList.remove("stop-scroll");
}
CSS
.stop-scroll {
margin: 0;
height: 100%;
overflow: hidden;
}
这将阻止页面滚动:
body, html {
overflow: hidden
}
HTML css工作很好,如果主体标签不做什么,你也可以写
<body scroll="no" style="overflow: hidden">
在这种情况下,重写应该在body标签上,它更容易控制,但有时会让人头疼。
如果你不介意页面滚动到顶部的话。你可以:
position: fixed;
在你不想滚动的元素上。我知道这不是你想要的答案,但我直接回答了那些谷歌这个问题的人。