2009-08-03 9 views
6

¿Existe alguna manera para que Mobile Safari reconozca un sitio destinado a teléfonos móviles y amplíe automáticamente? ¿Cómo funciona eso en otros teléfonos y navegadores?zoom automático en el safari de iphone

Me gustaría evitar mirar user_agent y enviar una página diferente para cada navegador móvil.

Respuesta

9

Ver la parte configuring the viewport de la web-app guía para desarrolladores de Apple.

+1

derecho, esto es lo que pensé que la pregunta se refería. Como ejemplo, agregue un elemento que se parece a:

+0

¡Gracias! Funciona en Opera Mini también. No estoy seguro acerca de otros navegadores. – m33lky

0

Los sitios pueden reconocer un navegador móvil y producir resultados en consecuencia, esa es generalmente la manera deseada.

Safari detectará la anchura y zoom-a-forma, pero más allá de eso ...

0

Puede evitar tener diferentes páginas basadas en User Agent utilizando CSS condicional. De hecho, Apple tiene una muy buena documentación sobre la creación de páginas web que pueden admitir Safari en el iPhone junto con los navegadores de escritorio.

Recomendaría comenzar con la lectura iPhone Human Interface Guidelines for Web Applications. Esto le dará un buen comienzo en el uso de CSS condicional para personalizar las páginas en función de las características del dispositivo (como el tamaño de la pantalla) en lugar de User Agent.

1

Me acabo de dar cuenta de que si tiene su cuerpo o la altura div principal del envoltorio configurada al 100%, esto puede interferir con lo lejos que se amplía/renderiza en un navegador móvil. Confirmado esto en el safari móvil y el navegador Chrome de Android. Una vez que configuré la altura #siteWrapper del 100% en automático, se procesó a una escala mucho mejor.

(altura del 100% en un envoltorio principal se utiliza a menudo con pies pegajosos.)

+0

Este no era el problema que tenía pero me dio una pista. Resultó que la eliminación de una declaración de ancho mínimo resolvió mi problema. – tanman

Cuestiones relacionadas