5

在 SO 上提出了一个关于iPhone 4 用户代理和iOS 5.0用户代理的问题。

我使用以下内容来检测不同的移动设备、视口和屏幕。

我希望能够区分 iPhone 5 和所有其他 iOS 设备。据我所知，我用来检测 iOS 5.0 用户代理的行var iPhone5也适用于任何运行 iOS 5.0 的 iOS 设备，所以从技术上讲它是不正确的。

var pixelRatio = window.devicePixelRatio || 1;

var viewport = {
    width: window.innerWidth,
    height: window.innerHeight
};

var screen = {
    width: window.screen.availWidth * pixelRatio,
    height: window.screen.availHeight * pixelRatio
};

var iPhone = /iPhone/i.test(navigator.userAgent);
var iPhone4 = (iPhone && pixelRatio == 2);
var iPhone5 = /iPhone OS 5_0/i.test(navigator.userAgent); // ?
var iPad = /iPad/i.test(navigator.userAgent);
var android = /android/i.test(navigator.userAgent);
var webos = /hpwos/i.test(navigator.userAgent);
var iOS = iPhone || iPad;
var mobile = iOS || android || webos;

window.devicePixelRatio是设备上的物理像素和与设备无关的像素 (dip) 之间的比率。window.devicePixelRatio=物理像素/下降。

更多信息在这里。

4

2 回答 2

11

为什么不根据屏幕对象检测-

screen.availWidth
screen.availHeight

在我的 iPhone 5 上，它报告 320 宽度和 548 高度，这是它在非视网膜形式的分辨率。

您不应该使用 window.innerWidth 和 window.innerHeight 因为它报告视口大小。如果页面被放大，它将报告放大区域的大小，而不是可用屏幕的正确大小。

于 2012-11-20T22:06:22.597 回答
3

2行就足够了：

var iphone4 = (window.screen.height == (960 / 2));
var iphone5 = (window.screen.height == (1136 / 2));
于 2014-05-13T07:42:54.673 回答