Question

我在整个屏幕上使用弹出窗口。打开弹出窗口时，我将正文和html CSS设置为溢出：隐藏并防止屏幕滚动。在所有浏览器上都可以正常工作，并且在android设备上也可以，但是问题出在iOS设备上。我无法停止在ios设备上滚动。

<html style="overflow: hidden;">
<body style="overflow: hidden;">
<div class="popup" style="position: fixed;">
</div>
</body>
</html>

我需要干净的CSS解决方案。我已经尝试添加位置：相对，位置：固定，但是不起作用。

有解决方案吗？

Answer 1

几天前我遇到了同样的问题，最终我想到了这个问题。

嗯，有一个非常简单的解决方案可以解决这个问题... 必须将元素设置为具有相对位置。对于例如，如果要指定主体以隐藏水平您想在您的滚动条中包含以下CSS 样式表：

body {
  position:relative;
  overflow:hidden;
}

OR

如果上述方法不起作用，另一种方法是添加jQuery

我们可以使用类似的方法来防止刷卡：

$('body').bind('touchmove', function(e){e.preventDefault()});

并重新允许再次刷卡（即关闭菜单或全屏模式时）：

$('body').unbind('touchmove');

希望这对您有所帮助：）

Answer 2

对不起，我的英语。几天后，我找到了这个解决方案，对我来说很有效！

position: touch-action: none;
-ms-touch-action: none;