Safari iPhone - ¿Cómo detectar el nivel de zoom y el desplazamiento?

Estoy buscando opciones sobre cómo rastrear y hacer zoom en una página cuando se ve en Safari en un iPhone. Safari expone movimientos y gestos de eventos, así que teóricamente puedo mantener un recuento de operaciones de desplazamiento y zoom, pero eso parece exagerado ya que el navegador debe rastrearlo internamente.Safari iPhone - ¿Cómo detectar el nivel de zoom y el desplazamiento?

¿Está expuesta esta información a través del Modelo de objetos del documento?

Fuente

2009-03-21 Jason Kester

De acuerdo con Safari Web Content Guide, los eventos de zoom (doble toque) no están expuestos, por lo que no estoy seguro de cómo puede hacer un seguimiento de esto.

No creo que esta información esté expuesta a través del DOM.

Fuente

2009-08-21 21:42:02

De hecho, creo que las cosas pueden haber cambiado un poco desde la respuesta de Steve, al echar un vistazo al enlace de la guía de contenido que proporcionó puedo ver una sección en Handling Multi-Touch Events y también Handling Gesture Events.

No las he probado todavía pero parecen bastante prometedoras. Voy a ofrecer una actualización una vez que los he comprobado y tienen un enlace de demostración disponibles ...

Fuente

2010-03-11 01:47:06

google fastflip (http://fastflip.googlelabs.com/) lo hace, por lo que es ciertamente posible – cobbal

¿Tiene una actualización por venir? ;) – alex

Al acercar el zoom, window.innerWidth se ajusta, pero document.documentElement.clientWidth no es, por lo tanto:

var zoom = document.documentElement.clientWidth/window.innerWidth;

(He probado iOS4, sin viewport<meta>).

Sin embargo, no confiaría en él para algo importante. Tamaños/tamaños de píxeles de la vista DOM en navegadores móviles are a complete mess.

Fuente

2010-06-24 14:19:45 Kornel

Gracias por eso. Es un truco, pero parece que en realidad podría funcionar, que al menos es algo. –

Solo señalando aquí (por lo tanto, tal vez se necesite una ejecución de documento menos) que 'document.documentElement.clientWidth' no incluya las barras de desplazamiento, mientras que' window.innerWidth' sí. Lo mismo para la altura – icedwater

Ignorando barras de desplazamiento, para Safari 10, var var = document.documentElement.clientWidth/window.outerWidth; – uchuugaka

mido enfocar esta manera (funciona en iOS solamente):

screenOrientedWidth = screen.width; 
if (window.orientation == 90) { 
    screenOrientedWidth = screen.height; 
} 
return screenOrientedWidth/window.innerWidth;

No depende de cuán amplio es el contenido.

Sin embargo, en iOS Safari window.innerWidth no es correcto dentro de un controlador gestureend. Debe aplazar dicho cálculo para su posterior ejecución. En GWT, uso scheduleDeferred, pero no puedo decir cómo implementar esto en JavaScript puro.

Fuente

2014-05-31 20:20:17 kirikaza

En Mobile Safari y Android, aquí hay una forma precisa de medir cuánto se ha acercado la página.

Pruébelo aquí: http://jsbin.com/cobucu/3 - cambie el zoom y luego haga clic en medir.

técnica consiste en añadir un div nivel superior:

<body> 
<div id=measurer style="position:absolute;width:100%"></div>

y utilizar el cálculo:

function getZoom(){ 
    return document.getElementById('measurer').offsetWidth/window.innerWidth; 
}

El único problema es encontrar una manera ordenada para detectar que el usuario ha cambiado el zoom (pinch , doble toque, etc.).Opciones:

webkitRequestAnimationFrame: muy fiable, pero es probable que causan jankiness si se utiliza animaciones (debido al impacto en el rendimiento)
setInterval:
eventos táctiles fiables pero muy feos: buscar dos dedos o doble toque : feo y tal vez difícil de hacer 100% confiable
window.onresize + window.onorientationchange + window.onscroll: simple pero totalmente no confiable (Editar: y onscroll puede causar problemas de rendimiento en WKWebView o Mobile Safari 8 o superior).

PS: Windows Phone necesita una solución diferente (pinch-zoom no cambia la vista - pinch-zoom en Windows tiene su propia ventana separada que no es visible a javascript).

Fuente

2015-04-21 11:08:59 robocat

Safari iPhone - ¿Cómo detectar el nivel de zoom y el desplazamiento?

Respuesta

Cuestiones relacionadas