禁用Safari IOS12中的双击缩放/调整大小

Question

禁用Safari IOS12中的双击缩放/调整大小

4

我在互联网上搜索了99%的网站，但没有一个答案可以解决我的问题。我正在使用iOS 12，有没有什么jQuery可以完全禁用Safari双击现在？或者我能有一些代码检测功能，当（如果）用户双击时？我花了2周时间尝试了很多方法，但还是没有找到解决方案...以下是我尝试过的CSS：

* {
  -webkit-text-size-adjust: none;
  zoom: 1;
  touch-action: manipulation;
}
* {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

并且禁用iOS 10+ Safari的视口缩放？

我讨厌Safari..

- ominsi kathsas

也许这个对你有用：https://dev59.com/ulYO5IYBdhLWcg3wN--f - Pablo Jareño López

似乎在iOS 12中这个不再起作用了。有什么办法可以让它在iOS 12上工作吗？ - ominsi kathsas

3个回答

9

将CSS样式touch-action: pan-y添加到<body>标签中，就这样。

- Marco Marsala

3

对于大多数情况，最简单的解决方案是直接移除缩放捏合功能。 - Someone Special

这将禁用捏合手势而不是双击手势（IOS 14）。 - A-Tech

0

为了禁用双击和捏合手势，我选择了以下组合：

禁用双击：

document.addEventListener("click", event => {
  event.preventDefault()
  event.stopPropagation()
})

禁用捏合手势:

<head>
    <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
</head>

- Lars Blumberg

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- nicopowa · Accepted Answer

在HTML元素上添加一个空的点击监听器会防止双击缩放。

虽然不美观，但能够起到作用。

myElement.addEventListener("click", event => {});

接下来我要尝试解决的问题是禁用所有缩放并防止捏合。

不幸的是，在iOS动量滚动期间不会分派触摸事件。以下代码只在页面不滚动时有效（仅在12.2上测试）:

document.addEventListener("touchstart", event => {
    if(event.touches.length > 1) {
        console.log("zoom plz stahp");
        event.preventDefault();
        event.stopPropagation(); // maybe useless
    }
}, {passive: false});