iOS 5为JavaScript/Web Apps带来了许多好东西.其中之一是改进滚动.如果你添加
-webkit-overflow-scroll:touch;
对于textarea元素的样式,滚动可以用一根手指很好地工作.
但是有一个问题.为防止整个屏幕滚动,建议Web应用程序添加以下代码行:
document.ontouchmove = function(e) {e.preventDefault()};
但是,这会禁用新滚动.
有没有人有一个很好的方法来允许在textarea内新滚动,但不允许整个表单滚动？
我只想在Safari(OSX Lion)中调整弹性滚动/弹跳效果.
我找到了overflow: hidden在css中为body 设置的解决方案,但正如预期的那样它只会禁用滚动条,所以如果网站比屏幕"更长",你将无法滚动!
欢迎任何解决方案或提示!谢谢!
我想防止移动铬的下拉到刷新(特别是iOS chrome).我的Web应用程序具有带设备宽度和设备高度视口的垂直平移事件,但是每当平移时,由于浏览器的默认功能,移动Chrome会自行刷新.此外,在Safari浏览器上,屏幕在平移事件期间滚动.我想禁用这些动作.
当然,我试过event.preventDefault(); 和触摸动作:无; 但它看起来不起作用.我应该在body标签上添加eventListner和touch-action吗？我期待有用的答案和例子.
我创建了一个模态.当模态打开时,我将停止桌面上的滚动overflow:hidden;到<body>.它正在发挥作用.
但它不适用于我的iPhone 6s Mobile Safari.
如何在移动野生动物园中打开模态时阻止滚动？
我知道这个问题已经被问过十几次了，但这些问题的解决方案都不适合我。
我希望 iOS 13 Safari 上的 body 元素不滚动。这意味着没有滚动，也没有弹性反弹（溢出滚动）效果。
我设置了两个彼此相邻的元素overflow: scroll;，它们应该滚动，只是它们周围的主体不应该滚动。
我尝试过的所有解决方案都不适用于头部带有以下标签并保存到主屏幕的渐进式网络应用程序。
<meta name="apple-mobile-web-app-capable" content="yes">
尝试 1：设置隐藏在正文和/或 html 上的溢出。不适用于 iOS 13 Safari。
html {
position: relative;
overflow: hidden;
height: 100%;
}
body {
position: relative;
overflow: hidden;
height: 100%;
}
在 iOS 13 safari 中什么都不做，但在 macOS safari 和 Firefox 中有效。
尝试2：固定在身体上的设置位置。对我不起作用，因为当用户滚动时，主体不会，但滚动仍然阻止我的两个内部元素在溢出反弹动画时滚动。
body {
position: fixed;
}
只将正文放在页面滚动上。滚动（溢出滚动）通过固定体发生......
尝试 3：防止默认触摸移动。没有用（是一个较旧的解决方案......）。
document.addEventListener("touchmove", function (e) {
e.preventDefault();
}, { passive: false });
我什么都不做。不是在 safari …
我正在我的网站上实现一个绘图应用程序,并尝试在用户绘制画布时防止过度滚动.尽管尝试了几种报告的解决方案,但我无法禁用Chrome的pull-to-refresh.
根据https://developers.google.com/web/updates/2017/11/overscroll-behavior,以下一行css应该可以解决这个问题..即时刷新和烦人的用户体验仍然存在.有任何想法吗？
<!DOCTYPE html>
<html>
<style type="text/css">
body {
/* Disables pull-to-refresh but allows overscroll glow effects. */
overscroll-behavior-y: contain;
}
</style>
<body>
<h1>Simple Site</h1>
</body>
<script type="text/javascript">
</script>
</html>
我正在使用html5画布+一些javascript(onmousedown/move/up)在网页上创建简单的绘图板.
在Opera,Firefox,Chrome等中运行正常(在台式机上试用).但是如果我用iPhone访问这个页面,当试图在画布上绘图时,它会拖动或滚动页面.
这适用于其他页面内容,通过向下滑动页面,您可以像往常一样在移动浏览器中浏览页面.但有没有办法在画布上禁用此行为,以便移动访问者可以实际上在其上绘制一些东西？
供您参考,这是一个简洁的例子:
<html><head><script type='text/javascript'>
function init()
{
var canvas = document.getElementById('MyCanvas');
var ctx = canvas.getContext('2d');
var x = null;
var y;
canvas.onmousedown = function(e)
{
x = e.pageX - canvas.offsetLeft;
y = e.pageY - canvas.offsetTop;
ctx.beginPath();
ctx.moveTo(x,y);
}
canvas.onmouseup = function(e)
{
x = null;
}
canvas.onmousemove = function(e)
{
if (x==null) return;
x = e.pageX - canvas.offsetLeft;
y = e.pageY - canvas.offsetLeft;
ctx.lineTo(x,y);
ctx.stroke();
}
}
</script></head><body onload='init()'>
<canvas id='MyCanvas' width='500' height='500' style='border:1px solid #777'>
</canvas></body></html>
是否有一些特殊的样式或事件我必须添加到画布中,以避免在画布中滑动时拖动/滚动页面？
在 iOS 8 的 Safari 上，当我专注于某个<input>元素时，整个页面会突然向下跳，然后返回到原来的位置。我的页面布局填满整个屏幕并且不打算滚动。
这似乎与此处和此处以及此视频中观察到的错误相同。这些情况下的解决方案适用于 Cordova 应用程序，但我不是在构建 Cordova 应用程序，我只是为 Mobile Safari 创建一个网站。
\n\n我已尝试按照此处的html, body { position: fixed; }建议添加添加，但这没有用。
我会尝试使用“禁用滚动”ontouchmove许多人之前提供的建议“禁用滚动”，但这不是用户触发的滚动，而是自动滚动。
我已尝试按照此处的onfocus="window.scrollTo(0, 0);"建议添加添加，但这不起作用，而且我不希望它对该答案给出评论：
\n\n\n这看起来应该可以工作，但在我的 iPhone 5S 和 iOS 8 的 Safari 上却不起作用。
\nevent.preventDefault()与您的解决方案结合起来似乎它肯定会起作用，但我仍然得到默认的滚动行为。\xe2\x80\x93 本尼 3 月 17 日 17:53
如何防止这种反弹？
\n在复习有关StackOverflow上该主题的许多问题和答案时，提供的所有解决方案均无法可靠地工作。所有CSS，JavaScript，jQuery和混合解决方案都至少存在一个缺陷，导致滚动无法有效禁用和/或切换。
我还在网上搜索了很多内容，但没有找到一个好的答案。
到目前为止，我具有此功能：
function toggleScroll(btn, item) {
$(btn).click(function() {
$(item).toggleClass("noscroll");
});
}
...这会将a添加overflow: hidden;到我想要的任何类中onclick，并在第二次单击时将其删除。
问题是，此代码不适用于iOS设备。
如何在iOS设备上使用此功能？
理想情况下，我希望使用纯CSS解决方案。但是我知道这可能是不可能的，尤其是切换组件。
任何JavaScript或jQuery解决方案也都可以。
提前致谢！
有没有办法在滚动div中禁用反弹效果？
到目前为止,我已经尝试过这些东西,但都没有效 请帮忙!
如何在移动Web应用程序中禁用iPhone上的垂直反弹/滚动
无法使用UIScrollView和pagingEnabled = YES禁用退回
和
谢谢!
javascript ×8
css ×5
ios ×5
html ×4
jquery ×2
mobile ×2
safari ×2
scroll ×2
chrome-ios ×1
cordova ×1
drag ×1
draw ×1
html5-canvas ×1
input ×1
ios5 ×1
modal-dialog ×1
objective-c ×1
osx-lion ×1