iphone - 在 iPad/iPhone 上缩放后重置比例

Question

在我的应用程序中，我启用和禁用某些部分的缩放

我启用缩放

$('head meta[name=viewport]').remove();
$('head').prepend('<meta name="viewport" content="user-scalable=yes, width=device-width,    minimum-scale=1.0 , initial-scale=1.0, maximum-scale=5.0" />');

当我离开可缩放部分时，我禁用缩放

$('head meta[name=viewport]').remove();
$('head').prepend('<meta name="viewport" id="testViewport" content="user-scalable=no, width=device-width, minimum-scale=1.0 , initial-scale=1.0, maximum-scale=1.0" />');

问题是，如果我放大了，然后退出...页面停留在可缩放状态

是否可以重置页面比例，然后使用 jquery 锁定缩放？

Answer 1

我有同样的问题，在网上找不到任何答案。我决定采用的解决方案是在用户单击可缩放区域后快速刷新页面。这有助于我唯一可缩放的内容位于灯箱中，因此灯箱的关闭与页面的快速刷新同时发生，这会将页面比例重置回我想要的位置。

所以，在灯箱关闭时，我会开火：`

• 位置.重新加载（）；`

页面刷新后，用户将被带回他们浏览内容的位置，并且用户体验恢复到我试图实现的页面规模。我希望这能给你一些想法。

Answer 2

我的解决方案是在比例改变之前记住比例，然后用视口按记忆比例缩放它。在 iOS7 上按视口缩放并不总是有效。所以我使用 location.reload(false); （杰森是如何写的）

Answer 3

//prevent zoom
$('meta[name=viewport]').remove();
$('head').append('<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=0">');

//enable zoom
$('meta[name=viewport]').remove();
$('head').append('<meta name="viewport" content="width=device-width, initial-scale=yes">' );

//reset zoom use all together in function
$('meta[name=viewport]').remove();
$('head').append('<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=0">');
$('meta[name=viewport]').remove();
$('head').append('<meta name="viewport" content="width=device-width, initial-scale=yes">' );