Html 完全禁用网页滚动
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16637031/
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
Completely disable scrolling of webpage
提问by Karim Geiger
I want to disable scrolling for my webpage, but completely, not just disable scrollbars so
我想禁用我的网页滚动，但完全，而不仅仅是禁用滚动条
overflow: hidden
will not work.
不管用。
Also this workaround does not apply on Macs due to the "soft-scroll" on edges. It will show a terrible shaky animation:
此外，由于边缘上的“软滚动”，此解决方法不适用于 Mac。它将显示一个可怕的抖动动画：
window.onscroll = function () {
window.scrollTo(0,0);
}
Is there any other method to disable scrolling completely?
有没有其他方法可以完全禁用滚动？
回答by Sych
Presuming the simplified HTML code is:
假设简化的 HTML 代码是：
<html><body><div class=wrap>content...</div></body></html>
Set both body, html to height:100%;
将 body, html 都设置为 height:100%;
body, html {height:100%;}
Put a div inside body, and set it to stretch across all the body height:
在 body 内放置一个 div，并将其设置为横跨整个身体高度：
div.wrap {height:100%; overflow:hidden;}
This will prevent window from scrolling in weird ways, like, pressing mouse wheel and moving it, using anchors, etc.
这将防止窗口以奇怪的方式滚动，例如按下鼠标滚轮并移动它，使用锚点等。
To remove the scroll bar itself (visually), you should also add:
要删除滚动条本身（在视觉上），您还应该添加：
body {overflow: hidden; }
To disable scrolling via pressing arrow keys on keyboard:
要通过按键盘上的箭头键禁用滚动：
window.addEventListener("keydown", function(e) {
// space, page up, page down and arrow keys:
if([32, 33, 34, 37, 38, 39, 40].indexOf(e.keyCode) > -1) {
e.preventDefault();
}
}, false);
