Detectar iPad Mini en HTML5
El iPad Mini de Apple es un clon más pequeño del iPad 2 en más aspectos de los que nos gustaría. En JavaScript, el window.navigatorobjeto expone los mismos valores para Mini y iPad 2. Hasta ahora, mis pruebas para detectar la diferencia no han tenido éxito.
¿Porque es esto importante?
Como las pantallas del iPad Mini y del iPad 2 son idénticas en píxeles pero varían en tamaño real (pulgadas/centímetros), varían en PPI (píxeles por pulgada).
Para que las aplicaciones web y los juegos ofrezcan una interfaz de usuario amigable, ciertos elementos se ajustan en tamaño en relación con la posición del pulgar o el dedo del usuario, por lo que es posible que queramos escalar ciertas imágenes o botones para brindar una mejor experiencia de usuario.
Cosas que he probado hasta ahora (incluidos algunos enfoques bastante obvios):
window.devicepixelratio- Ancho del elemento CSS en unidades de cm
- Consultas de medios CSS (como
resolutiony-webkit-device-pixel-ratio) - Dibujos SVG en unidades similares.
- Hacer todo tipo de transformaciones de CSS webkit durante un tiempo determinado y contar los fotogramas renderizados
requestAnimFrame(esperaba detectar una diferencia mensurable)
Me he quedado sin ideas. ¿Y tú?
Actualización Gracias por las respuestas hasta ahora. Me gustaría comentar sobre las personas que votaron en contra de detectar el iPad mini frente al 2, ya que Apple tiene, uhm, una pauta para gobernarlos a todos. Bien, aquí está mi razonamiento por el que creo que realmente tiene todo el sentido del mundo saber si una persona está usando un iPad mini o un iPad 2. Y haz con mi razonamiento lo que quieras.
El iPad mini no sólo es un dispositivo mucho más pequeño (9,7 pulgadas frente a 7,9 pulgadas), sino que su formato permite un uso diferente. El iPad 2 normalmente se sostiene con las dos manos cuando se juega, a menos que seas Chuck Norris . El mini es más pequeño, pero también es mucho más liviano y permite un juego en el que lo sostienes con una mano y usas la otra para deslizar, tocar o cualquier otra cosa. Como diseñador y desarrollador de juegos, me gustaría saber si es un mini para poder elegir proporcionarle al jugador un esquema de control diferente si así lo deseo (por ejemplo, después de una prueba A/B con un grupo de jugadores).
¿Por qué? Bueno, es un hecho comprobado que la mayoría de los usuarios tienden a utilizar la configuración predeterminada, por lo que dejan de lado un joystick virtual y colocan algún otro control basado en toques en la pantalla (solo damos un ejemplo arbitrario aquí) cuando el reproductor carga el juego por primera vez es lo que a mí, y probablemente a otros diseñadores de juegos, nos encantaría poder hacer .
Entonces, en mi humilde opinión, esto va más allá de las discusiones sobre pautas y dedos gruesos y es algo que Apple y todos los demás proveedores deberían hacer: permitirnos identificar de forma única su dispositivo y pensar de manera diferente en lugar de seguir pautas.
Reproduzca un archivo de audio estéreo y compare la respuesta del acelerómetro cuando el volumen está alto en el canal derecho y en el canal izquierdo: el iPad2 tenía parlantes mono mientras que el iPad Mini tiene parlantes estéreo incorporados.
Necesito su ayuda para recopilar los datos, visite esta página y ayúdeme a recopilar datos para esta loca idea. No tengo un iPad mini, así que realmente necesito tu ayuda.
Actualización: Parece que estos valores informan el ancho y alto de la ventana gráfica en el momento de la creación de la pestaña, y no cambian al girar, por lo que este método no se puede utilizar para la detección de dispositivos .
Puede utilizar cualquiera de los dos screen.availWidtho screen.availHeightsegún parezcan diferentes para iPad Mini y iPad 2.
Ipad mini
screen.availWidth = 768
screen.availHeight = 1004
Ipad 2
screen.availWidth = 748
screen.availHeight = 1024
Fuente: http://konstruktors.com/blog/web-design/4396-detect-ipad-mini-javascript/
