问题描述

一个 问题 被问到关于 iPhone 4 用户的 SO代理和 iOS 5.0 用户代理.

A question was asked on SO about the iPhone 4 user agent and the iOS 5.0 user agent.

我使用以下方法来检测不同的移动设备、视口和屏幕.

I use the following to detect different mobile devices, viewport and screen.

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

I'd like to be able to distinguish between the iPhone 5 and all other iOS devices. As far as I know, the line I'm using to detect the iOS 5.0 user agent var iPhone5 would also apply to any iOS device running iOS 5.0, so technically it's incorrect.

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 = 物理像素/倾角.

window.devicePixelRatio is the ratio between physical pixels and device-independent pixels (dips) on the device. window.devicePixelRatio = physical pixels / dips.

更多信息这里.

推荐答案

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

Why don't you detect based on the screen object -

screen.availWidth
screen.availHeight

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

On my iPhone 5 it reports 320 width and 548 height, which is its resolution in a non-retina form.

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

You should NOT use window.innerWidth and window.innerHeight due to it reporting the viewport size. If the page is zoomed in, it will report the size of the zoomed in area, and not the proper size of the available screen.

这篇关于检测 iPhone 5 及其下方的任何 iOS 设备的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！