视口宽度更改后在iOS上重置缩放

我们正在制作一个HTML5应用程序,在devise时不知道宽度。 所以我们在运行时改变视口标签来匹配所需的尺寸。

例如

<meta name="viewport" id="viewport-meta" content="width=' + params.mobilePortraitWidth + ', initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 

在iOS上的问题是,我们改变视口大小后,视图不能正确缩放,直到我们双击屏幕。

编辑,双击后,所有罚款,所以:我们如何可以“双击”编程?

非常感谢你

  NSString * js = @“var t = document.createElement('meta'); t.name =”viewport“; t.content =”initial-scale = 1.0,maximum-scale = 3.0“; document.getElementsByTagName('head “)[0] .appendChild(T);“;
 [myWebView stringByEvaluatingJavaScriptFromString:js]; 

编辑
感谢您的更新。
我有非常相似的问题,并记住设置视口元标记解决了它。
如果你试图修改这个元标记加载HTML后,尝试在webViewDidFinishLoadloadRequest是asynchronous)。

另一个解决scheme是将您的html文件读入NSString并在将其加载到webView之前replace该元标记。
希望能帮助到你!

非常感谢您的回复,我想分享我们在iOS9.2和iOS8.2的iPad Air上进行一些testing后发现的解决scheme。

基本上,要使其工作,我们没有设置初始规模= 1.0,最大规模= 1.0,用户可扩展=没有

以下是一个工作示例

 <html> <head> <meta name="viewport" id="viewport-meta" content="width=device-width, user-scalable=no" /> <style> html, body { -webkit-text-size-adjust: 100%; } h1 { padding: 1em; background-color: #FF80BB; } </style> </head> <body> <h1>I am the page content</h1> <button id="s320">Set 320</button><br /> <button id="s640">Set 640</button><br /> <button id="s960">Set 960</button> <script> function setViewportWidth(newWidth) { var m = document.getElementById("viewport-meta"); m.setAttribute('content', 'width=' + newWidth + ', user-scalable=no'); } document.getElementById("s320").onclick = function () { return setViewportWidth(320); }; document.getElementById("s640").onclick = function () { return setViewportWidth(640); }; document.getElementById("s960").onclick = function () { return setViewportWidth(960); }; </script> </body> </html>