window.devicePixelRatio并不在IE 10移动工作?(window.device

2019-09-02 00:31发布

我使用window.devicePixelRatio这适用于安卓和iPhone,但在IE 10的Windows Mobile不起作用。 任何替代方案?

Answer 1:

对于IE回落,台式机和移动,使用:

window.devicePixelRatio = window.devicePixelRatio || 
                          window.screen.deviceXDPI / window.screen.logicalXDPI;


Answer 2:

window.devicePixelRatio = window.devicePixelRatio || 
Math.round(window.screen.availWidth / document.documentElement.clientWidth)

明白了来自http://blogs.windows.com/windows_phone/b/wpdev/archive/2012/11/08/internet-explorer-10-brings-html5-to-windows-phone-8-in-a-big -way.aspx



Answer 3:

我发现,在诺基亚Lumia 1230 window.devicePixelRatio返回1,即使价值显然是不正确的属性。 对于window.screen.deviceXDPI / window.screen.logicalXDPI测试返回1.52083333。 因此,首先利用window.devicePixelRatio是不是一个好主意。

我建议如下:

function getDevicePixelRatio (){
    var pixelRatio = 1; // just for safety
    if('deviceXDPI' in screen){ // IE mobile or IE
        pixelRatio = screen.deviceXDPI / screen.logicalXDPI;
    } else if (window.hasOwnProperty('devicePixelRatio')){ // other devices
        pixelRatio = window.devicePixelRatio;
    }
    return   pixelRatio ;
}

出于某种原因,用最好的方法来测试的deviceXDPI的画面对象的存在:

    if(screen.hasOwnProperty('deviceXDPI')) {// IE mobile or IE

这款手机在不工作。



Answer 4:

其实,没有以前的答案是正确的。 所有的测试均低于上的Lumia 520个手机具有480的液晶屏* 800发:

WP8 / IE移动10:

  • window.devicePixelRatio =未定义
  • window.inner / outerWidth /高度= 320 * 485
  • 屏幕。[无济于事]宽度/高度= 330 * 549
  • document.body.clientWidth /高度= 320 * 486
  • screen.device / logicalXDPI =九十六分之一百四十= 1.45833 ..

预期devicePixelRatio是三百二十零分之四百八十○= 1.5,其可以通过下式计算:

Math.round(screen.availWidth * screen.deviceXDPI / screen.logicalXDPI / 4) * 4 / document.body.clientWidth

(舍入需要得到有效的液晶屏尺寸)

WP8.1 / IE移动11:

  • window.devicePixelRatio = 1.42177 ...
  • window.outerWidth /高度= 338 * 512
  • window.innerWidth /高度= 320 * 485
  • 屏幕。[无济于事]宽度/高度= 338 * 563
  • document.body.clientWidth /高度= 320 * 486
  • screen.device / logicalXDPI =96分之136= 1.4166 ..

预期devicePixelRatio是(再次) 三百二十零分之四百八十零= 1.5,其可以通过下式计算:

Math.round(screen.availWidth * window.devicePixelRatio / 4) * 4 / document.body.clientWidth

所以,即使window.devicePixelRatio存在,它会给你DOM屏幕尺寸和液晶屏尺寸之间的比率,然而,DOM屏幕尺寸大于可用视口大小。 如果你想知道CSS像素和设备像素之间的确切比例,那么你必须对上面的计算。 此外,这些计算是在纵向模式下有效。 在横向模式下使用screen.availHeight代替(DOM屏幕尺寸不与方向变化对IE浏览器的移动改变)。



文章来源: window.devicePixelRatio does not work in IE 10 Mobile?