IE9 devicePixelRatio 等效答案

【问题标题】：IE9 devicePixelRatio equivalentIE9 devicePixelRatio 等效
【发布时间】：2012-02-08 07:08:38
【问题描述】：

有没有人发现一种可靠的方法来确定 Windows Phone 7.5 (Mango) 的设备像素比。

它基于 IE9。在基于 Webkit 的浏览器中，我们有 window.devicePixelRatio 或使用 window.matchMedia() 和适当的媒体查询。

在 Windows Mobile 中，我可以通过以下方式确定像素比率： screen.deviceXDPI / screen.logicalXDPI 尽管这似乎只有在页面完全呈现后才可靠。在此之前 deviceXDPI 报告与logicalXDPI 相同

有人找到解决办法了吗？

感谢任何帮助/建议

【问题讨论】：

喜欢social.msdn.microsoft.com/Forums/nl-NL/iewebdevelopment/thread/… ?
是的，类似于那个人的问题。 Windows Phone 根本不支持 window.devicePixelRatio 属性，尽管该设备的设备像素比为 1.5。为具有更高像素比率的设备加载更高分辨率版本的资产对我来说很重要。这也必须发生在客户端。
您在多个 WP 设备上的图像真的有明显的不同吗？您能否提供一个示例图像以及您看到差异的设备？

标签： cross-browser internet-explorer-9 media-queries porting dpi

【解决方案1】：

在媒体查询中使用(min/max-)resolution 作为等效测试：

@media (min-resolution: 1.5dppx), (min-resolution: 144dpi), (-webkit-min-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2) {}

或通过matchMedia：

if (window.matchMedia) 
  {
  if (window.matchMedia('(resolution: 96dpi)').matches) { }
  // resolution feature & dppx unit
  if (window.matchMedia('(min-resolution: 1dppx)').matches) { }
  // -webkit-device-pixel-ratio feature
  if (window.matchMedia('(-webkit-min-device-pixel-ratio: 1)').matches) { }
  // -o-device-pixel-ratio feature
  if (window.matchMedia('(-o-min-device-pixel-ratio: 1/1)').matches) { }
  }

参考文献

【讨论】：