使用javascript查找实际屏幕分辨率(不是CSS像素,真实屏幕)

Question

这些天像素和点之间存在很大差异(CSS像素,DIPS).在我的特定计算机上它是相同的,但在视网膜Mac和许多手机上,每点有4或8个像素.http://www.quirksmode.org/blog/archives/2010/04/a_pixel_is_not.html

也就是说,在CSS声明中使用的"像素",例如width:300px或font-size:14px,与设备的实际像素密度无关,甚至与传闻即将到来的中间层无关.它们本质上是一个专门为我们的Web开发人员创建的抽象结构.

我想获得屏幕分辨率(真正的屏幕分辨率,你现在得到它),然后提供缩放的图像以最大限度地填满屏幕.这意味着无需在移动设备上获得2000x2000像素的图像,同时仍然可以在大型mac上获得良好的分辨率.悬停,当使用screen.height它时返回CSS像素而不是屏幕分辨率,这意味着视网膜mac将获得一个大小为屏幕大小的图像,从而导致像素化.有什么方法可以获得实际的屏幕分辨率,或javascript中的像素到点数比率？

Answer 1

这将为您提供实际的屏幕高度,无论像素密度如何通过包含视口标记而改变...

screen.height * window.devicePixelRatio