2012-07-20 16 views
11

EDIT: He subido un video a youtube que demuestra el error aquí: http://www.youtube.com/watch?v=zkDYlgtX5HkExplorador de Android/error de desplazamiento de Samsung Galaxy SII en formularios web. Seleccione hitboxes lista no se desplazan

Tengo un bicho muy raro que he encontrado pruebas de mi nueva aplicación web en un Samsung Galaxy S2 con Android 4.03 ICS.

Lo que sucede es que cuando carga un formulario en el explorador web predeterminado y luego despliega hacia abajo la página, el área de hitbox/tocable parece permanecer donde estaba en la pantalla cuando se cargó la página por primera vez, aunque el elemento de formulario se ha desplazado hacia arriba en la pantalla.

Por lo que puedo decir con los pocos dispositivos de prueba que tengo disponibles, creo que esto solo ocurre en el Samsung Galaxy S2 ya que lo probé en el simulador de Android con la misma versión de android y no pude replicar problema. Sé que esto hace que sea una base de usuarios muy específica la que tiene la sonda, sin embargo, la última vez que revisé, el Galaxy s2 era el teléfono Android más popular en mi país (Australia), por lo que sería bueno encontrar una solución.

He creado una página muy simple para demostrar esto en http://users.tpg.com.au/geoffica/test.html

Puede reproducir el problema de la siguiente manera:

  1. carga la página en un Galaxy S2
  2. de desplazamiento del navegador para esa página llena por completo la pantalla y la barra de direcciones es solo en la parte superior de la pantalla.
  3. Donde está la casilla de selección, coloque su dedo al costado de la pantalla como un marcador de dónde estaba la lista de selección.
  4. Desplácese hacia abajo por la página a cualquier distancia, (manteniendo la lista de selección en la pantalla) y luego toque el espacio en blanco donde solía estar la lista de selección y las opciones que aparecerían en la pantalla. Puede tomar algunos intentos para obtenerlo, pero sucederá.

Ahora sé que estás pensando que esto es bastante complicado de replicar y es raro que ocurra, pero en un formulario que creé para un cliente debido a dónde se colocaron los elementos, el hitbox siempre superpuso el botón de enviar del formulario, por lo que es muy difícil presionar el botón de enviar. Las listas seleccionadas también robarán toques de otras listas de selección si las casillas de hits se superponen, haciendo que aparezcan las opciones incorrectas al tocarlas.

He intentado muchas cosas, pero la única solución que he encontrado hasta ahora es usar el evento touchstart para activar mi botón de envío en lugar del evento click. Esto parece suceder antes del evento de clic de las listas de selección y evita que ingrese primero, pero esto dista mucho de ser ideal, y no impide que las listas de selección roben los clics de otros elementos en la página.

También he pensado en rodar mi propio plugin jquery para tal vez colocar las listas de selección fuera de pantalla y luego desencadenar sus eventos de clic tocando un enlace o algo así. Si es un dispositivo móvil, las opciones aparecerán en la pantalla, independientemente de la posición de la lista de selección. Sin embargo, esto sería bastante engorroso y tendría que tener en cuenta el efecto que esto tendría en los usuarios procedentes de una PC o ipad, por ejemplo, que muestra las opciones en una lista desplegable en su lugar. Suena bastante prolematico para mi Incluso puede requerir algún navegador/dispositivo específico de Galaxy s2.

¿Alguien tiene una solución real para esto, además de simplemente no usar listas de selección?

+0

¿Ha encontrado alguna solución para esto? Yo también tengo el mismo problema. –

+0

No, nunca encontré una solución. En el sitio en el que estaba trabajando, sucedió con mucha frecuencia en el botón de enviar de una página de búsqueda (debido a la ubicación de esos elementos en la página), lo cual fue realmente frustrante de usar. Lo arreglé activando la acción de envío con el "toque inicial" en lugar de "hacer clic" para ese botón (como se mencionó anteriormente) pero no pude arreglar los otros lugares en los que puede suceder en el sitio. Sin embargo, parece ser definitivamente un error de navegador/os. Solo puedo esperar que los usuarios instalen Chrome en lugar del navegador predeterminado. – pantryfight

Respuesta

-6

Creo que esto podría ser un problema se puede solucionar con Jquery-móvil Sólo simple porque cuando no lo usas, lo sitio web un aspecto muy raro en navegadores móviles

Quizás sea esta la solución y esto es solo una pista :)

0

¿Está usted por casualidad usando un posicionamiento absoluto para ello? esto se fijará en un área determinada en la pantalla, no en la página.

0

En primer lugar, me gustaría actualizar la cabecera del documento a una cabecera adecuada HTML5:

<!DOCTYPE html> 
Cuestiones relacionadas