Android Navegador textarea se desplaza por todo el lugar, es inutilizable

Así que he construido una bonita y brillante aplicación HTML5 dirigida a Safari móvil y al navegador predeterminado de Android. Las versiones de Android que estoy probando en son 2,1 y 2,2.

Mi aplicación tiene una área de texto en una de sus páginas, y esta área de texto tiende a tener una buena cantidad de texto a veces. Es básicamente un campo de escritura de forma libre.

Esto funciona como se esperaba en iOS. Sin embargo, en Android, a medida que escribe, la pantalla se desplaza desmesuradamente hacia arriba y hacia abajo en cada pulsación de tecla, a menudo no se puede ver lo que está escribiendo a medida que escribe, y te mareas de todo el salto. Además, si el contenido dentro de la zona de texto excede su altura, parece imposible desplazarse dentro de ella.

Ni siquiera me ponga en marcha en modo paisaje. Las cuestiones anteriores son aún más pronunciadas.

Esto se siente como un error con Android, ya que realmente no hay nada de fantasía sobre mi textarea. Lo he despojado de lo esencial, y se comporta lo mismo.

¿Preguntándose si alguien más se ha divertido tanto con sus textareas en Android, y tal vez podría dar algún consejo, o al menos simpatizar?

Parece que Google ha logrado resolver sobre todo esto en la interfaz web de Gmail para Android. Supongo que hay algo de magia de JS porque mi marcado / CSS es idéntico.

SOLUCIÓN: El webkit 3D está roto en Android, esto está causando este problema. Asegúrese de que no está utilizando -webkit-transform: translate3d (0, 0, 0); O -webkit-backface-visibility: oculto; En cualquier cosa relacionada con las entradas. 🙁

Si es posible, puede bloquear el desplazamiento de la pantalla mientras el usuario está escribiendo estableciendo la propiedad de desbordamiento del cuerpo a 'oculto' – puede activar / desactivar selectivamente en eventos de enfoque / desenfoque. Por supuesto, esto significa que su usuario no podrá desplazarse mientras escribe

No hay respuesta mágica. Interacciones de entrada de teclado de Android con formularios web es simplemente horrendo. Debes enhebrar la aguja con mucho cuidado para que funcione correctamente y el comportamiento del teclado no es el mismo en las versiones de Android. Pero es posible con mucho trabajo (vea nuestro marco de Sencha Touch para lo que es posible hoy en día – los otros marcos de la web móvil están abordando exactamente los mismos problemas también).

Experimento este comportamiento en casi todas las páginas. Aquí en StackOverflow, en un blog de wordpress y muchos más.

Sólo puedo imaginar que esto es un error / problema de usabilidad en el navegador android y es por eso que prefiero interfaz de usuario / aplicación nativa 🙂