javascript - window.screen.width 和 window.screen.height 在 iPad 3 上不起作用

Question

我正在使用这些功能

window.screen.width
window.screen.height

检测用户的屏幕分辨率。它们在 PC 上的工作就像一个魅力，但在 iPad 3 上却不行。它们输出 768 和 1024 而不是 2048 和 1536。

有人可以帮我吗？先感谢您

Answer 1

是的。欢迎来到有趣的移动设备世界！

iPad 3（和其他视网膜设备）使用window.devicePixelRatioset to2来显示它们具有与逻辑像素不同的 css 像素。iPad 3 仍然报告 1024 × 768，因为这是 CSS 像素的数量。

作为另一个混淆来源，一些 Android 设备报告视口宽度，而一些报告物理宽度，这意味着如果您询问一些 Android 设备，window.screen.height如果文档很长，则将是成千上万。

简而言之，对于您的问题，请window.devicePixelRatio用作乘数。我会使用类似的东西

if(!window.devicePixelRatio) {
    window.devicePixelRatio = 1;
}

确保如果未设置，则在开始之前将其声明为 1。

Answer 2

if(window.devicePixelRatio !== undefined) {
    dpr = window.devicePixelRatio;
} else {
    dpr = 1;
}

var screen_width = window.screen.width * dpr;
var screen_height = window.screen.height * dpr;

该解决方案完美运行。