使用javascript查找屏幕尺寸，以英寸为单位，而不是像素

find screen dimensions in inches not pixels using javascript

本文关键字：为单位 像素 屏幕 javascript 使用 查找      更新时间：2023-09-26

我读了很多关于SO的问题，关于以像素为单位检测屏幕尺寸的最佳方法，这最终取决于分辨率来找到实际的屏幕尺寸。

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

所以当你想向用户展示你的页面时，你真的需要以英寸或厘米为单位的屏幕尺寸来提供最好的视觉。

所以我问:有没有办法找出设备的屏幕尺寸(以英寸而不是像素为单位)?我知道可以，只要我们知道解决方案!因为我们可以通过屏幕宽度和高度来计算尺寸

感谢任何主意!

一旦你得到了以像素为单位的屏幕分辨率，你可以用一个隐藏的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;
示例

现在，据我所知，没有可靠的方法可以准确地获得设备的屏幕宽度。所有内容(包括英寸，1in == 96px)都以某种方式基于屏幕分辨率。

现在，我知道这可能不是解决所有人的问题，但希望它能帮助一些人。这对我很有帮助，因为我想让我的页面在移动用户中表现得不同，而我最初的攻击计划是基于屏幕尺寸。

我最后做的是替换行

if (screen.height <= 768)


if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|Opera Mini/i.test(navigator.userAgent))

作为免责声明，我还应该提到，这是来自几年前的一个答案，所以有些设备可能不包括在内。

来源:https://stackoverflow.com/a/26577897/8082614

相关文章：