Javascript Srcset似乎没有在iOS7中使用mobilesafari？

对于网站上的徽标，使用以下图像标签：

<img src="images/logo.png" srcset="images/logo2.png 2x"/>

为什么它对我不起作用？他们是否从Webkit中删除了它而选择了替代方案？

更新：9/14/14 今天向公众发布的iOS8现在支持，因此预计很快会有很好的普及率

---

Safari、mobile或desktop还不支持

虽然webkit在几个月前就发布了它，但截至2014年2月，它还是（桌面版）的。它实际上在下一个公开发行版（v34）中，这是14年4月6日的当前测试版。所以当大多数人读到这篇文章时，它应该可以在destktop Chrome上进行测试

我目前的策略/建议是：

<img src="images/high.png" 
     srcset="images/low.png 1x,images/high.png 2x" width="100" height="100"/>

这将使视网膜图形立即在所有移动和台式机上显示，并通过浏览器缩小分辨率较低的屏幕

当mobile safari引入

srcset

时，非视网膜iPad将自动恢复为

low.png

，以节省带宽（谁知道苹果甚至会设置只下载低分辨率图像）

在桌面Chrome（v.34）和其他浏览器上（最终），浏览器基本上会忽略

src

，如果屏幕分辨率高，则会得到

high.png

，如果分辨率标准，则会得到

low.png

此外，即使在“常规”屏幕上，如果zoomlevel高于1.0（当您访问页面或刷新时），它也会为您提供

high.png

文件。这是一个很好的方法，也是使用srcset over mediaquerys或javascript替换技术的一个很好的理由

---

高级版（我今天的实际推荐）：

这有一个明显的问题，从今天起，您将为每个人提供高分辨率图像，直到

srcset

支持有所改善，这可能需要一段时间

因此，我选择了以下服务器端折衷方案（考虑到我的高分辨率图像的主要消费者是retina iPad）：

//服务器端（伪代码）-（我为此制作了一个ASP.NET MVC帮助程序）
@if（Request.UserAgent.Contains（“iPad”））
{
} 
否则{
}

任何具有

srcset

支持的人都将始终获得适当的版本。桌面用户（ChromeV34除外）将获得标准分辨率的图像。所有iPad将无条件获得高分辨率图像，直到苹果更新Safari，届时非视网膜iPad将获得低分辨率版本

幸运的是，我正在设计的网站在一两个月内不会发布，我希望Safari能在几个月内更新，让这成为我愿意冒险的未来

---

提示：要测试high.png和low.png，只需为

high.png

和

low.png

放两张完全不同的图像，就像猫和狗一样，然后就可以清楚地知道它是否工作了。

它将在iOS8的秋天上市-Twitter上有人确认，根据，但这有误导性，因为现在基本上是Chrome，主要是桌面。幸运的是，iOS用户更新很快，再过一两个月，iOS 8的用户数量应该会大幅增加

<img src="images/high.png" 
     srcset="images/low.png 1x,images/high.png 2x" width="100" height="100"/>

 high.png = 200x200
 low.png = 100x100

// server side(pseudocode)- (I made an ASP.NET MVC helper for this)
@if (Request.UserAgent.Contains("iPad"))) 
{

<img src="images/high.png" 
     srcset="images/low.png 1x,images/high.png 2x" width="100" height="100"/>

} 
else {

<img src="images/low.png" 
     srcset="images/low.png 1x,images/high.png 2x" width="100" height="100"/>

}