javascript – 如何在iPhone上的方向更改上重置Web应用程序的缩放缩放？

概述当我在纵向模式下启动我的应用程序时，它工作正常。然后我旋转到景观，它的规模。为了使它能够正确缩放横向模式，我必须双击两次，首先放大所有的方式(正常双击行为)，然后再次全部放大(再次，正常的双击行为) 。当它缩小时，它会缩放到横向模式的正确的NEW刻度。 切换回肖像似乎工作更一致;也就是说，它处理缩放，以便当方向更改回纵向时比例是正确的。 我试图找出这是否是一个错误？或者如果这是可以用Javascr 当我在纵向模式下启动我的应用程序时，它工作正常。然后我旋转到景观，它的规模。为了使它能够正确缩放横向模式，我必须双击两次，首先放大所有的方式(正常双击行为)，然后再次全部放大(再次，正常的双击行为) 。当它缩小时，它会缩放到横向模式的正确的NEW刻度。

切换回肖像似乎工作更一致;也就是说，它处理缩放，以便当方向更改回纵向时比例是正确的。

我试图找出这是否是一个错误？或者如果这是可以用JavaScript固定的东西？

使用视口元数据内容，我将初始比例设置为1.0，我不是设置最小或最大比例(也不想)。我将宽度设置为设备宽度。

有任何想法吗？我知道很多人会感谢有一个解决方案，因为它似乎是一个持续的问题。

谢谢！

解决方法 Jeremy Keith( @adactio)在他的博客 Orientation and scale上有一个很好的解决方案

不要在标记中设置最大尺寸，以使标记可扩展。

<Meta name="vIEwport" content="wIDth=device-wIDth,initial-scale=1">

然后在加载时禁用JavaScript的可伸缩性，直到您在允许使用此脚本再次具有可伸缩性的gesturestart时：

if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) {    var vIEwportMeta = document.querySelector('Meta[name="vIEwport"]');    if (vIEwportMeta) {        vIEwportMeta.content = 'wIDth=device-wIDth,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0';        document.body.addEventListener('gesturestart',function () {            vIEwportMeta.content = 'wIDth=device-wIDth,minimum-scale=0.25,maximum-scale=1.6';        },false);    }}

更新22-12-2014：
在iPad 1这不工作，它失败的eventListener。我发现删除.body修复：

document.addEventListener('gesturestart',function() { /* */ });

总结

以上是内存溢出为你收集整理的javascript – 如何在iPhone上的方向更改上重置Web应用程序的缩放/缩放？全部内容，希望文章能够帮你解决javascript – 如何在iPhone上的方向更改上重置Web应用程序的缩放/缩放？所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。