检测HiDPI Windows Phone 8设备

And*_*rew 10 internet-explorer high-resolution windows-phone-8

如何检测运行Windows Phone 8的HiDPI设备?

我正在测试的手机是诺基亚Lumia 920,它有一个4.5英寸1280×768的屏幕(即> 300 dpi).IE支持min-resolutionCSS但不支持min-device-pixel-ratio.使用此设备像素密度测试,Lumia报告96 dpi.这远低于实际的屏幕分辨率,并且将被视为常规的非HiDPI设备.

由于IE还没有(还)支持window.devicePixelRatioJavaScript,我找不到一种方法来准确地检测Lumia是否能够显示HiDPI图像.

Ama*_*lik 8

查看http://timkadlec.com/2013/01/windows-phone-8-and-device-width/

从理论上讲(我没有手机对其进行测试)如果您将以下所有内容添加到页面中,您应该被授予为Windows Phone 8和Windows 8设备获得有效DPR的能力.

HTML元视口(当前/传统的非W3C实现)

<meta name="viewport" content="width=device-width" /> 
Run Code Online (Sandbox Code Playgroud)

CSS @viewport(当前/未来的W3C草案实施):

@-webkit-viewport{width:device-width}
@-moz-viewport{width:device-width}
@-ms-viewport{width:device-width}
@-o-viewport{width:device-width}
@viewport{width:device-width}
Run Code Online (Sandbox Code Playgroud)

Javascript在Windows Phone 8中禁用元视口的古怪@viewport覆盖:

if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
    var msViewportStyle = document.createElement("style");
    msViewportStyle.appendChild(
        document.createTextNode(
            "@-ms-viewport{width:auto!important}"
        )
    );
    document.getElementsByTagName("head")[0].
        appendChild(msViewportStyle);
}
Run Code Online (Sandbox Code Playgroud)

那么对于正确实现screen.width的所有移动浏览器screen.width/document.documentElement.clientWidth应该是一个有效的近似值window.devicePixelRatio