动态更改移动Safari中的元视口属性

Question

我正在开发一个自适应网站，我们通过媒体查询向移动设备和平板电脑提供不同的样式表。

我们的目标是为Iphone和iPad提供良好的体验，并尝试尽可能地消除移动Safari定位错误。我已经研究了各种可能的解决方案，但是他们要么似乎不能正常工作，要么他们不适合这个项目，直到我认为我找到了一个来自PPK's site的答案，他意味着可以动态地改变视口宣布后马上使用Javascript。

我试过下面的代码无济于事：

<meta name="viewport" id="testViewport" content="user-scalable=yes" /> 
<script> 
var mvp = document.getElementById('testViewport'); 
if (screen.width < 740) { 
    alert("mobile screen"); 
    mvp.setAttribute('content','320'); 
} 
var value = mvp.getAttribute("content"); 
alert(value); 
</script> 

我的警告被称为在那里我会期待他们，（所以在iPhone上，最终的警报说“价值”是= = 320），但视口自然会显示它。

请注意，我已经在内容属性中初始化'user-scalable = yes'以便将它从空白处保存，我试图弄清楚什么是错误的。

任何线索或提示将不胜感激！

Answer 1

据https://developer.apple.com/library/safari/#documentation/appleapplications/reference/SafariHTMLRef/Articles/MetaTags.html，你应该将视用正确的字符串width = 320：

mvp.setAttribute('content','width = 320'); 

Answer 2

只需使用：

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

与iOS-Orientationchange-Fix