orientation - rotacion - rotar pantalla iphone 6
El sitio receptivo se acerca cuando se alterna entre Vertical y Horizontal en iPad/iPhone (6)
Aunque establecer la escala máxima en "1" sí funciona, restringe a los usuarios el acercamiento de cualquier cosa dentro de su sitio. No es ideal para la experiencia del usuario. Pruebe este Javascript en su lugar, corrección de cambio de orientación de iOS
Construí un sitio receptivo usando Twitter Bootstrap aquí: http://zarin.me/cce/
El diseño receptivo funciona muy bien en iPad y iPhone, sin embargo, cuando cambio el dispositivo de vertical a horizontal, el sitio se amplía en lugar de adaptarse a la pantalla (pellizca la pantalla funciona).
¿Qué me estoy perdiendo? ¿Es esto un problema de ventana? Este es el único código de ventana que tengo en mi:
<meta content="width=device-width, initial-scale=1.0" name="viewport">
¡Gracias por adelantado!
Establecer initial-scale=1.0 en el meta:
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
Luego configure -webkit-text-size-adjust:100%; en el CSS:
body {
-webkit-text-size-adjust: 100%;
}
Este enfoque no impide que un usuario amplíe su sitio web, pero se asegurará de que el texto no se ajuste automáticamente al tamaño del navegador.
He visto esto suceder cuando uno de los contenedores en la página se derrama más allá del 100%. La página muestra el valor correcto en la orientación inicial, pero cuando se cambia la orientación, el ancho extra se convierte de alguna manera en vigor, haciendo que la página se escale, y generalmente deja un margen a la derecha o a la izquierda. Vale la pena revisar todas sus consultas de medios para asegurarse de que no haya ningún margen o relleno posterior.
Lo siguiente funciona para mí y permite a los usuarios hacer zoom
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
También quiere agregar la escala máxima
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
Tenía exactamente este problema en Ipad 3 y IOS 7.1.2
El uso de escala máxima = 1 lo solucionó y permite el zoom
La solución js no funcionó