Jquery mobile PhoneGap、jQuery Mobile和视网膜显示

我正在使用jQuery Mobile开发PhoneGap应用程序。 目前我只在iPhone和iPhone视网膜模拟器中进行测试

当我以视网膜模式打开应用程序时，应用程序的密度是正确的，但页面在两个维度上都只有屏幕大小的一半

我自己的猜测是，jquerymobile的css没有扩展宽度和高度，但我还没有找到任何关于这方面的信息

我的HTML包含以下内容：

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

---

我遗漏了什么？我想你猜对了

查看JQM.css文件

它仅包括高分辨率/低分辨率图标的媒体查询。其他一切都和视网膜和非视网膜设备一样，因此JQM仅在图标大小方面支持视网膜

通过指定初始比例=.5、最大比例=.5、最小比例=.5，您将所有内容锁定在50%。这就是不可伸缩的半页

你为视网膜高端设备定制的越多，标准浏览器尤其是低端浏览器（如IE7）的麻烦就越大。例如，检查IE7中的JQM iconsprite定位-如果您没有包含支持媒体查询的脚本，图标将处于关闭状态

我认为目前还没有足够的视网膜设备来保证JQM提供跨浏览器视网膜和非视网膜解决方案

我发现了一些好消息。我也只做了一个CSS，可以用到IE7

---

检查我的插件中所需的CSS，使图标和渐变背景在所有浏览器上看起来都很好，以及为IE7+8定制所需的额外CSS数量。retina/non-retina JQM.css文件很好，但很难下载：-

在您的情况下，您必须只针对图像，而不是整个视口。

---

图像的大小必须比正常显示的图像小一半。

您的答案很难理解

if ($.mobile.media("screen and (min-width: 320px)")) {
    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');
    }
}