使用javascript查找以英寸为单位的屏幕尺寸而非像素

Question

我正在阅读关于SO的许多问题,关于以像素检测屏幕尺寸的最佳方法,这最终取决于找到实际屏幕尺寸的分辨率.

我知道一些移动设备有小屏幕(比如4英寸)但分辨率很高.虽然有些设备有大屏幕(比如7英寸标签),但分辨率很低.

因此,当您想要向用户显示您的页面时,您确实需要以英寸或厘米为单位的屏幕尺寸,以提供舒适眼睛的最佳视图.

所以我问:有没有找到设备的屏幕尺寸,而不是像素？我知道它可以,只要我们知道决议!我们可以根据屏幕宽度和高度来计算尺寸

欣赏任何想法!

Answer 1

一旦你获得了像素的屏幕分辨率,你可以用隐藏的div计算出dpi:

<div id="dpi" style="height: 1in; width: 1in; left: 100%; position: fixed; top: 100%;"></div>

JS

var dpi_x = document.getElementById('dpi').offsetWidth;
var dpi_y = document.getElementById('dpi').offsetHeight;

然后计算出以英寸为单位的分辨率:

var width = screen.width / dpi_x;
var height = screen.height / dpi_y;

例