禁用所有移动设备的滚动
这听起来像应该有一个在互联网上的解决scheme，但我不知道为什么我不能find它。 我想要禁用移动设备上的水平滚动。 基本上试图做到这一点：
body{ overflow-x:hidden // disable horizontal scrolling. } 这可能是相关的信息：我也有这个在我的头标记，因为我也不希望用户能够缩放：
<meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;' name='viewport' /> <meta name="viewport" content="width=device-width" />
谢谢
html, body { overflow-x: hidden; } body { position: relative }
相对的位置很重要，我只是偶然发现。 没有它，不能使它工作。
cgvector的答案没有为我工作，但是这样做：
document.body.addEventListener('touchstart', function(e){ e.preventDefault(); });
我不会像这样离开它，需要一个更智能的逻辑来select何时防止滚动，但这是一个好的开始。
采取从这里： 禁用iPhone Web应用程序的滚动？
为了后代：
要防止滚动，但保持上下文菜单，请尝试
document.body.addEventListener('touchmove', function(e){ e.preventDefault(); });
它仍然可以防止超过某些人可能喜欢的方式，但是对于大多数浏览器来说，唯一的默认行为应该是滚动。
对于一个更复杂的解决scheme，允许在不滚动的身体滚动的元素，并防止橡皮筋，看看我的答案在这里：
尝试添加
html { overflow-x: hidden; }
以及
body { overflow-x: hidden; }
我怀疑大多数人都想要禁用缩放/滚动，以便将更多类似应用程序的体验融合在一起; 因为答案似乎包含缩放和滚动的解决scheme的元素，但没有人真的钉上任何一个。
滚动
要回答OP，你似乎需要做的唯一一件事情就是禁用滚动，就是拦截窗口的scroll和touchmove事件，并且调用preventDefault和stopPropagation来处理事件。 像这样
window.addEventListener("scroll", preventMotion, false); window.addEventListener("touchmove", preventMotion, false); function preventMotion(event) { window.scrollTo(0, 0); event.preventDefault(); event.stopPropagation(); }
在你的样式表中，确保你的body和html标签包含以下内容：
html: { overflow: hidden; } body { overflow: hidden; position: relative; margin: 0; padding: 0; }
缩放
但是，滚动是一回事，但您可能也想禁用缩放。 你在标记中使用元标记：
<meta name="viewport" content="user-scalable=no" />
所有这些结合在一起给你一个应用程序的经验，可能是最适合的canvas。
（如果您使用的是canvas，请注意某些人的build议，将initial-scale和width等属性添加到元标记中，因为canvas会缩放其内容，而不像块元素，并且会用一个丑陋的canvas，往往不是）。
在风格中使用这个
body { overflow:hidden; width:100%; }
在头标中使用这个
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0" /> <meta name="apple-mobile-web-app-capable" content="yes" />
这适用于我：
window.addEventListener("touchstart", function(event){ if(event.target.tagName=="HTML" || event.target.tagName=="BODY"){ event.preventDefault(); } } ,false);
它不工作100％，我还补充说：
window.addEventListener("scroll",function(){ window.scrollTo(0,0) },false)
在页眉中，添加
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-sacle=1, maximum-scale=1, user-scalable=no">
在页面样式表中，添加
html, body { overflow-x: hidden; overflow-y: hidden; }
这是html和body！
下面的作品对我来说，虽然我没有testing每个设备都有testing:-)
$（'body，html'）.css（'overflow-y'，'hidden'）; $（'html，body'）。animate（{scrollTop：0}，0）;
这可以防止在移动设备上滚动，而不是单击/点击。
document.body.addEventListener('touchstart', function(e){ e.preventDefault(); });
