过渡到iOS 7:在iPad上查看的jQuery/iPhone Webapps的正确视口设置

Question

我们有一个基本上有一个UIWebView的应用程序,在XCode中设置为"iPhone App".

到目前为止一切工作正常,但使用iOS 7 iPad模拟器,应用程序现在立即显示在"全屏",这不会是问题,但WebView似乎也放大了.

我只看到加载的网站的右上角1/4,必须滚动查看其余部分.

我们在应用程序中使用jQuery mobile 1.3.1.

编辑

我发现了错误.看来,视口元元素的语义在iOS版本之间发生了变化.

更改

<meta name="viewport" content="width=device-width, initial-scale=1">

至

<meta name="viewport" content="initial-scale=1">

为我工作,但我不确定这是否是要走的路,因为jQuery Mobile Demo Page确实将设置为设备.当我从UIWebView加载Demo-Page时,我得到了同样的效果.

是否有关于设置视口的"正确方法"的信息,特别是因为演示页面使用width = device-width

Answer 1

在iOS 7上,它已经改变了解释vieport元标记的方式.在这里您可以找到解释https://developer.apple.com/library/ios/releasenotes/General/RN-iOSSDK-7.0/#//apple_ref/doc/uid/TP40013202-CH1-SW75.

以前,修改视口参数时,旧参数永远不会被丢弃.这导致视口参数是累加的.

例如,如果以width = device-width开始,然后将其更改为initial-scale = 1.0,则最终会得到width = device-width,initial-scale = 1.0的计算视口.

在iOS 7中,已经解决了这个问题.现在你最终得到了一个初始比例= 1.0的计算视口.

现在的问题是:这将如何影响iOS6 <和Android设备上的布局？