检测iPhone 5及其下方的任何iOS设备

Question

甲问题是如此询问关于所述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是设备上物理像素与设备无关的像素(下降)之间的比率.window.devicePixelRatio=物理像素/下降.

更多信息在这里.

Answer 1

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

screen.availWidth
screen.availHeight

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

由于报告了视口大小,因此不应使用window.innerWidth和window.innerHeight.如果页面被放大,它将报告放大区域的大小,而不是可用屏幕的正确大小.