无法在 JavaScript 上更改 iOS 的缩放

Question

我有 1000x820 的网站 这不是一个真正的网站，不要问我响应式网页设计。

视口：

<meta name="viewport" content="target-densitydpi=device-dpi, width=1000px, user-scalable=no">

然后在装有 iOS 10 的 Iphone SE 上。 添加到主屏幕。

以 1000px 宽度启动应用程序，它在两个方向上都非常好，我们可以更改它。当然我们不能缩放。 聚焦输入并键入文本。虽然没有缩放。不聚焦输入或改变方向，我们的比例就会被破坏。我们无法改变它。

$('meta[name=viewport]').remove();
$('head').append('<meta name="viewport" content="target-densitydpi=device-dpi, width=1000px, user-scalable=no">' );

这对我没有帮助。 字体也变态。

我有个坏主意。跟踪视口的变化并刷新页面。

Answer 1

你的元标记包括user-scalable=no 和一个明确的width。

删除user-scalable 并将width 更新为width=device-width。您可以使用initial-scale=1.0 设置设备的缩放级别。

• MDN - Using the viewport meta tag to control layout on mobile browsers