基于设备分辨率更改视口

Question

如何根据设备分辨率更改元视口？我们可以使用媒体查询来定位不同的分辨率屏幕，如何设置不同的视口？

像我的演示站点工作正常在iPad上用这个元标记

<meta name="viewport" content="width=device-width, user-scalable=no,initial-scale=1, maximum-scale=1, minimum-scale=1" /> 

但iPhone4的，我需要这个

<meta name="viewport" content="width=device-width, user-scalable=no,initial-scale=.5, maximum-scale=.5, minimum-scale=.5" /> 

Answer 1

//test for iOS retina display 
$.mobile.media("screen and (-webkit-min-device-pixel-ratio: 2)"); 

文档：http://jquerymobile.com/demos/1.0a4.1/#docs/api/mediahelpers.html

UPDATE：

查找了一分钟后，我发现jQuery可以更改元标记。

尝试这样：

// Check for iPhone screen size 
if($.mobile.media("screen and (min-width: 320px)")) { 
    // Check for iPhone4 Retina Display 
    if($.mobile.media("screen and (-webkit-min-device-pixel-ratio: 2)")) { 
     $('meta[name=viewport]').attr('content','width=device-width, user-scalable=no,initial-scale=.5, maximum-scale=.5, minimum-scale=.5'); 
    } 
}