¿Cómo puedo forzar un sitio a escala para fijar para móviles (Iphone android ..)
Cuando carga mi sitio en un iphone no se reduce. Todo lo que veo es la parte superior izquierda de cientos de píxeles cuadrados. Soy nuevo en la optimización móvil, pero siento que la mayoría de las páginas se ajustan automáticamente, y la mayoría de las preguntas parecen ser para el escenario opuesto al que estoy teniendo (no forzar el teléfono a bajar de tamaño).
Quisiera que el ancho de la página entera fuera visible y lo hiciera así que el usuario tendría que acercar para leer el texto.
- Android WebView no sólo de vídeo audio
- Cómo eliminar el espacio específico entre el padre y el niño en un ExpandableListView
- Cómo agregar cuadros a la imagen?
- Vista superficial en capas en un FrameLayout en Android
- ¿Cómo puedo ver que View se vuelve visible
He intentado con y sin el siguiente código en la cabeza, pero sin efecto aparente.
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- I Also tried: --> <meta name="viewport" content="width=1024, initial-scale=1">
- API de Android 23. WebView cómo ignorar errores de JavaScript
- ListView muestra imágenes incorrectas y duplicadas
- Webview con inicio de sesión de Windows parpadeando en el cuadro de diálogo
- ExpandableLists en Android, sólo quiero permitir que una lista de padres se expanda al mismo tiempo
- SetBackground vs setBackgroundDrawable (Android)
- Cómo iniciar una actividad desde la vista personalizada
- Cómo desplegar una parte de la imagen en android
- A veces listView.getChildAt (int index) devuelve NULL (Android)
Utilizando los documentos aquí: https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
Parecía que debía ignorar la mayoría de las propiedades de la ventana de visualización y simplemente establecer la escalabilidad del usuario a "sí". Está funcionando en mi iphone ahora.
<meta name="viewport" content="user-scalable = yes">
Editar :: El sitio de probador móvil no permite la escala, por lo que sólo da scrollbars. Con un teléfono real esto funciona.
Trate de utilizar css diferentes y cambiarlos (lado del servidor) en función de la configuración del cliente. Por ejemplo, el iPhone se identificará como:
HTTP_USER_AGENT=Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1C25 Safari/419.3
Dependiendo de qué lenguaje de scripting tiene disponible en el lado del servidor, puede cambiar el css.
He aquí un ejemplo.
La etiqueta de ventana gráfica controla qué parte de la página se va a mostrar inicialmente, pero la página en sí debe estar diseñada para que se muestre un tamaño de pantalla 320×460 en el iPhone sin ampliar. Si no desea modificar la estructura de la página, viewport le da control sobre cómo se muestra la página inicialmente.
Deshacerse de la width=1024
, sólo tiene que poner
<meta name="viewport" content="width=device-width, initial-scale=1" />
Y, limpiar el caché del navegador de su teléfono. Incluso tendría que apagar y volver a encender después.
- Cursor de Android con ORMLite para usar en CursorAdapter
- ¿Cómo puede obtener la dirección de correo electrónico de un usuario de Android?