javascript - 视网膜(或其他高分辨率)显示器是否会影响基于分辨率的手机和平板电脑之间的区别？

Question

我为同一个网站制作了两个不同的网页:一个用于手机设备，一个用于桌面设备。主要原因是因为该网页有很多按钮，如果您使用的是手机，则很难触摸这些按钮，因为它们在手机屏幕上看起来很小。所以我制作了一个 javscript，它根据屏幕的分辨率将用户重定向到相应的页面。

if ( (screen.width < 800) && (screen.height < 600) ) { 
    window.location = 'mobilesite';
} else {
    window.location = 'desktopsite';
}

但我担心新的视网膜显示器。我认为这种方法行不通。 (我没有视网膜显示设备来测试它)

我决定不使用基于操作系统的区分，因为我的问题是大小，而不是操作系统，例如 Android/IOS/Kindle 等。平板电脑我更喜欢用户使用桌面版，因为它在大屏幕上看起来更好。

所以我有两个问题:1.- 视网膜显示器的分辨率影响浏览器的分辨率？ (或者可能只有 native 应用程序)

2.- 使用 javascript 或 jquery 客户端是否有任何不同的方法来区分手机和平板电脑？

此外，我认为重要的是不要将脚本限制为仅检测 IOS 设备中的这种差异，很快其他品牌的手机将采用更高分辨率的显示屏。

谢谢!

Answer 1

Apple Retina 屏幕会报告自己，好像它的像素数量是实际像素数量的一半，因为浏览器本身会变魔术。如果要检测高分辨率屏幕，请乘以像素密度。

不要进行用户代理检查，因为您将每 2 周添加更多设备。它破坏了网络。进行功能检查或特定检查。

哦，如果您只是想为移动设备显示更大的按钮，您将需要阅读 CSS3 媒体查询。