Обнаружение устройств Windows Phone 8 HiDPI

Как установить HiDPI-устройства под управлением Windows Phone 8?

Телефон, который я тестирую, - это Nokia Lumia 920, который имеет экран размером 4,5 дюйма 1280 × 768 (т.е. 300 dpi). IE поддерживает min-resolution в CSS, но не min-device-pixel-ratio. Используя этот тест плотности пикселей устройства, Lumia сообщает 96 точек на дюйм. Это намного ниже фактического разрешения экрана и будет считаться обычным устройством без HiDPI.

Так как IE еще не поддерживает window.devicePixelRatio в JavaScript, я не могу найти способ точно определить Lumia как способный отображать изображения HiDPI.

Ответы

Ответ 1

Отъезд http://timkadlec.com/2013/01/windows-phone-8-and-device-width/

Теоретически (у меня нет телефона, чтобы проверить это), если вы добавите на свою страницу все перечисленные ниже данные, вам должна быть предоставлена ​​возможность получить действительный DPR для устройств Windows Phone 8 и Windows 8.

HTML meta viewport (текущие/устаревшие реализации без W3C)

<meta name="viewport" content="width=device-width" />

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}

Javascript, чтобы отключить причудливое переопределение вида просмотра метаданных в Windows Phone 8:

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);
}

Тогда screen.width/document.documentElement.clientWidth должно быть допустимым приближением window.devicePixelRatio для всех мобильных браузеров, которые правильно реализуют screen.width