14

我想禁用我的网页的滚动，但完全不只是禁用滚动条，所以

overflow: hidden

不管用。

此外，由于边缘上的“软滚动”，此解决方法不适用于 Mac。它将显示一个可怕的摇晃动画：

window.onscroll = function () {
window.scrollTo(0,0);
}

有没有其他方法可以完全禁用滚动？

4

1 回答 1

46

假设简化的 HTML 代码是：

<html><body><div class=wrap>content...</div></body></html>

将 body 和 html 都设置为 height:100%;

body, html {height:100%;}

在 body 中放置一个 div，并将其设置为横跨整个身体高度：

div.wrap {height:100%; overflow:hidden;}

这将防止窗口以奇怪的方式滚动，例如按下鼠标滚轮并移动它，使用锚点等。

要删除滚动条本身（视觉上），您还应该添加：

body {overflow: hidden; }

要通过按键盘上的箭头键禁用滚动：

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);
于 2013-05-19T17:30:29.543 回答