Join FlipAndroid.COM Telegram Group: https://t.me/joinchat/F_aqThGkhwcLzmI49vKAiw


El evento de desplazamiento del navegador no se dispara con suficiente frecuencia en dispositivos iOS y Android

Estoy desarrollando un sitio de una página usando jQuery, greensock y scollorama.

No necesariamente necesita soportar navegadores móviles, pero sería bueno que funcionara en el iPad, así que con eso en mente, empecé a probar varios móviles y tablets.

El problema que encontré es que scrollorama se basa en el evento de desplazamiento que se dispara con bastante frecuencia ya que esto es lo que las animaciones se enganchan en – sin embargo, cuando se utiliza una pantalla táctil, los navegadores sólo parecen disparar el evento de desplazamiento al iniciar el arrastre y Cuando se detiene – esto es coherente en Opera Mini, Chrome, Safari, FF Mobile.

Para conseguir que mi página al menos trabaje parcialmente, necesito encontrar algo que me permita disparar el evento de desplazamiento más a menudo – ¿alguien sabe cómo?

PS He intentado usar iScroll como los documentos de scrollorama sugieren, sin embargo eso no funcionó y en su lugar rompió las animaciones y hizo que el desplazamiento fuera imposible – Estoy seguro de que el complemento funciona, pero no parece funcionar bien con lo que ' Ya tengo Estoy buscando algo menos involucrado que un complemento, sólo un fragmento para activar el evento de desplazamiento ideal.

TL, DR

Los dispositivos con pantallas táctiles sólo parecen activar el evento de desplazamiento javascript una o dos veces durante un arrastre. ¿Hay un parche simple que puedo hacer en JS o jQuery que disparará el evento de desplazamiento con más frecuencia?


Actualización: He intentado enganchar en los acontecimientos del tacto y accionar el hojeador del hojeador con ellos como así:

$(document).on('touchstart touchend touchmove', function(){ $(window).trigger('scroll'); }); 

Esto parecía darme mejores resultados en Android usando Firefox, aunque no creo que esté disparando tantas veces como me gustaría que fuera mejor que nada.

Voy a probar en otros navegadores y ver si esto ayuda.

Actualización 2:

El código anterior ayudó mucho en FF en Android, pero no en el iPhone. Intenté agregar manejadores para los eventos gestuales que el iPhone dispara, pero no hay cambio.

 $(window).on('touchstart touchend touchmove mousewheel touchcancel gesturestart gestureend gesturechange orientationchange', function(){ //alert($(window).scrollTop()); $(window).trigger('scroll'); }); 

  • Haga que las pestañas de ActionBar se desplacen cuando alcance límite, en lugar de crear una lista desplegable
  • ScrollView no se desplaza en absoluto
  • Rellenar Listview de JSON
  • Horizontal RecyclerView dentro de ListView sin desplazamiento muy suave
  • Android: Altura total de ScrollView
  • ¿Cómo hacer que el desplazamiento de Listview sea más lento?
  • Sincronización de dos ListViews lado a lado de Android
  • Desplazamiento de imagen enriquecido y zoom en android
  • 2 Solutions collect form web for “El evento de desplazamiento del navegador no se dispara con suficiente frecuencia en dispositivos iOS y Android”

    Pre-iOS 8:

    No es un problema de que el evento de desplazamiento se dispare lo suficiente. En cambio, los navegadores de iOS detienen la actualización (es decir, "repintando") la pantalla mientras se encuentra en medio de un gesto de desplazamiento.

    Safari WebKit, que es el componente de representación HTML que se utiliza obligatoriamente en todos los navegadores iOS según la política de Apple, detiene el repintado durante los gestos de desplazamiento para conservar la vida de la batería y reducir el calor. Tenga en cuenta que JavaScript sigue funcionando normalmente en segundo plano durante un gesto de desplazamiento, incluso si la pantalla no puede reflejar los cambios en tiempo real que se realizaron en el DOM durante un gesto de desplazamiento. Tan pronto como el gesto termina, un evento de pintura se dispara inmediatamente y la pantalla se actualiza. Sin embargo, los bucles del temporizador, como los que se configuran a través de setInterval , no se disparan durante los gestos de desplazamiento.

    También vale la pena señalar que si mueve los dedos muy lentamente al iniciar un desplazamiento, el gesto de desplazamiento no surtirá efecto hasta después de mover el dedo aproximadamente a 10 píxeles de su posición de inicio. Durante el movimiento dentro de este radio de 10 píxeles, la pantalla continúa actualizándose instantáneamente. En el momento que WebKit decida que su dedo se ha movido lo suficiente para iniciar el desplazamiento, las actualizaciones de pantalla se deshabilitan hasta que finalice el movimiento de desplazamiento.

    La razón por la que este problema no afecta a "algunas" páginas web o bibliotecas JavaScript es que efectivamente "congelan" el desplazamiento de la página y en su lugar emulan el desplazamiento interceptando eventos táctiles y ajustando la propiedad body.scrollTop consecuencia. onscroll el desplazamiento de la página adjuntando un controlador de eventos al evento onscroll y emiten un event.preventDefault() desde el controlador de eventos.

    IOS 8 y posterior:

    Apple está haciendo que el evento de desplazamiento sea más fluido en iOS 8:

    http://developer.telerik.com/featured/scroll-event-change-ios-8-big-deal/

    Por mi parte, deshabilité la función de ios Chrome

     // Fix Chrome iOS if(!navigator.userAgent.match('CriOS')){ // do my stuff here } 

    No conozco la lista completa de navegadores que no actualizan la pantalla en desplazamiento. Si alguien puede ayudar;)

    FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.