停用或删除 HTML 上的滚动条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3034390/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Deactivate or remove the scrollbar on HTML
提问by Wassim AZIRAR
I want to de-activate or remove the vertical scrollbarin an HTML page.
How to do that ?
我想取消激活或删除scrollbarHTML 页面中的垂直。
怎么做 ？
Thanks.
谢谢。
回答by meder omuraliev
If you really need it...
如果你真的需要它...
html { overflow-y: hidden; }
回答by Greg McNulty
put this code in your html header:
将此代码放在您的 html 标题中：
<style type="text/css">
html {
overflow: auto;
}
</style>
回答by hndcrftd
What I would try in this case is put this in the stylesheet
在这种情况下我会尝试将它放在样式表中
html, body{overflow:hidden;}
this way one disables the scrollbar, and as a cumulative effect they disable scrolling with the keyboard
这样就可以禁用滚动条，作为一种累积效果，他们禁用了键盘滚动
回答by Ananth Vivekanand
Meder Omuraliev suggested to use an event handler and set scrollTo(0,0). This is an example for Wassim-azirar. Bringing it all together, I assume this is the final solution.
Meder Omuraliev 建议使用事件处理程序并设置 scrollTo(0,0)。这是 Wassim-azirar 的一个例子。综合起来，我认为这是最终的解决方案。
We have 3 problems: the scrollbar, scrolling with mouse, and keyboard. This hides the scrollbar:
我们有 3 个问题：滚动条、鼠标滚动和键盘。这隐藏了滚动条：
html, body{overflow:hidden;}
Unfortunally, you can still scroll with the keyboard: To prevent this, we can:
不幸的是，您仍然可以使用键盘滚动：为了防止这种情况，我们可以：
function keydownHandler(e) {
var evt = e ? e:event;
var keyCode = evt.keyCode;
if (keyCode==38 || keyCode==39 || keyCode==40 || keyCode==37){ //arrow keys
e.preventDefault()
scrollTo(0,0);
}
}
document.onkeydown=keydownHandler;
The scrolling with the mouse just naturally doesn't work after this code, so we have prevented the scrolling.
在这段代码之后，鼠标滚动自然不起作用，所以我们阻止了滚动。
For example: https://jsfiddle.net/aL7pes70/1/
回答by Luke Barkess
This makes it so if before there was a scrollbar then it makes it so the scrollbar has a display of none so you can't see it anymore. You can replace html to body or a class or ID. Hope it works for you :)
这使得如果之前有滚动条，那么它使滚动条显示为无，因此您无法再看到它。您可以将 html 替换为正文或类或 ID。希望这对你有用 ：）
html::-webkit-scrollbar {
display: none;
}
