Detección de iPhone 5 y cualquier dispositivo iOS debajo de ella

Question

A question se le preguntó en SO sobre el agente de usuario iPhone 4 y el agente de usuario iOS 5.0.

Utilizo lo siguiente para detectar diferentes dispositivos móviles, ventanas y pantallas.

Me gustaría poder distinguir entre el iPhone 5 y todos los demás dispositivos iOS. Por lo que yo sé, la línea que estoy usando para detectar el agente de usuario de iOS 5.0 var iPhone5 también se aplicaría a cualquier dispositivo iOS con iOS 5.0, por lo que técnicamente es incorrecta.

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 es la relación entre los píxeles físicos y píxeles independientes del dispositivo (huecos) en el dispositivo. window.devicePixelRatio = píxeles físicos/inmersiones.

Más información here.

Answer 1

¿Por qué no Detectar basándose en el objeto de imagen -

screen.availWidth 
screen.availHeight 

en mi iPhone 5 se informa 320 de anchura y 548 de altura, que es su resolución en una forma no-retina.

NO debe usar window.innerWidth y window.innerHeight porque informa el tamaño de la ventana gráfica. Si la página se amplía, informará el tamaño del área ampliada y no el tamaño adecuado de la pantalla disponible.

Answer 2

2 líneas son suficientes:

var iphone4 = (window.screen.height == (960/2)); 
var iphone5 = (window.screen.height == (1136/2));