pantalla web iPhone splash no funciona

En aplicaciones web iPhone supuestamente puede definir una pantalla personalizada que aparecerá mientras el sitio se está cargando (al cargar el sitio desde un ícono de marcador guardado en la página principal). El objetivo es hacer que la experiencia de inicio de la aplicación web se sienta mucho más como una aplicación de iPhone real.pantalla web iPhone splash no funciona

Creo que la sintaxis es la siguiente:

<link rel="apple-touch-startup-image" href="/splash.png" /> (colocado en la sección <head> de la página).

Donde splash.png es una imagen de 320x460 orientada verticalmente.

Parece que no puedo hacer que funcione ... ¿Alguien tiene consejos y trucos para esto?

Fuente

2009-10-29 Scrappydog

Apple no tiene mucho en la forma de documentación sobre este tema (ver this URL).

Un par de cosas a tener en cuenta:

el fragmento de código que ya ha proporcionado asume su imagen está viviendo en http://yourdomain.com/splash.png
Esto sólo funciona para iPhone OS 3.0 y posterior
La imagen debe ser un archivo PNG
la imagen sólo se visualiza hasta DOM de la página está listo

también puede utilizar º e siguiente código para establecer explícitamente el icono de la aplicación web:

<link rel="apple-touch-icon" href="/apple-touch-icon.png" />

Fuente

2009-10-30 01:32:43 richleland

Asegúrese de que sea de 320x460 píxeles.

Usted ya lo dijo, pero esa fue la solución para mí.

Fuente

2010-09-05 00:41:54

Asegúrate de que todos estos enlaces aparezcan después de tus otras hojas de estilo en tu encabezado.

Fuente

2010-11-08 09:04:03 james

iOS 4 no muestra la pantalla de bienvenida si tiene una barra de notificaciones en la parte superior, p. cuando se usa el punto de acceso personal (tethering).

Fuente

2011-07-07 11:34:31

Solo puede establecer una pantalla de bienvenida o de lo contrario fallará. Para seleccionar una pantalla de inicio de ipad o iphone necesitas un poco de javascript.

La pantalla de bienvenida de ipad landscape que se puede usar para aplicaciones nativas no funciona para aplicaciones web. Tampoco una pantalla de salpicadura retina para el iphone4. Solo puede elegir un splash de ipad o iphone. Establecer el atributo de tamaño en el elemento de enlace parece funcionar en el ipad. Pero tener más de un elemento de enlace de imagen splash hace que el iphone falle.

Los tamaños de la pantalla de presentación deben ser exactos. 320x460 para iphone/ipod y 1024x748 para ipad. Si necesita una pantalla de barra horizontal, tendrá que rotarla en photoshop ya que no hay control durante el relanzamiento de la aplicación.

Para probar, es mejor intentar primero con la memoria caché de la aplicación apagada y acelerar el ancho de banda con el proxy de charles o algo similar.

<!-- status bar --> 
<meta name="apple-mobile-web-app-status-bar-style" content="black" /> 

<!-- hide safari chrome --> 
<meta name="apple-mobile-web-app-capable" content="yes" /> 

<!-- iphone start up screens --> 
<script type="application/javascript"> 
    var appl = document.createElement("link"); 
    appl.setAttribute('rel', 'apple-touch-startup-image'); 
    if(screen.width < 321 && window.devicePixelRatio == 1) { 
     appl.setAttribute('href', 'img/icons/launch320x460.png'); //iphone 3Gs or below 
    } else if (screen.width < 321 && window.devicePixelRatio == 2) { 
     //setting @2x or a 640x920 image fails, just use the iphone splash screen 
    } else if (screen.width < 769 && Math.abs(window.orientation) != 90) { 
     appl.setAttribute('href', 'img/icons/launch1024x748.png'); //ipad 2 or below (portait) 
    } else if (screen.width < 769 && Math.abs(window.orientation) == 90) { 
     //landscape fails as well, use standard ipad screen 
    } 
    document.getElementsByTagName("head")[0].appendChild(appl); 
</script> 

<!-- iphone springboard icons --> 
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="img/icons/icon57x57.png" /> 
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/icons/icon114x114.png"> 
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/icons/icon72x72.png" />

Fuente

2011-10-07 04:17:33 puppybits

Tengo este script funcionando, pero parece que hay un error con las pantallas de presentación en el iPad. Si lanzo la aplicación web en formato horizontal la primera vez, no se muestran ninguna de las pantallas de bienvenida. Si lanzo en retrato la primera vez, esa pantalla de bienvenida funciona, pero el paisaje nunca funciona. Parece que no soy el único con este problema, consulte este hilo en el foro de la manzana: https://discussions.apple.com/thread/3316892?start=0&tstart=0 ¿Alguien puede confirmar que tienen creado con éxito y se muestran pantallas de presentación horizontal y vertical en las aplicaciones web iPad HTML5? – SondreB

Cada vez que me encuentro con este problema que casi siempre es causada por llamar a más de una pantalla de bienvenida para la misma página o en la pantalla de bienvenida no ser 320x460 píxeles (exactamente). Esto debería hacer el truco:

<link rel="apple-touch-startup-image" href="/splash-iphone.jpg" />

Pero antes de llamar a la pantalla de bienvenida, debe incluir estos tres líneas de código, así:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" /> 
<meta name="apple-mobile-web-app-capable" content="yes" /> 
<meta name="apple-mobile-web-app-status-bar-style" content="black" />

Fuente

2012-01-07 10:46:11 kaleazy

Ya hecho las cosas, no hubo suerte en iOS 10 en iPad – Developia

Tienes razón, este código debe estar en la sección y la imagen debe ser de 320x460 píxeles, la razón por la que no funciona es que la imagen DEBE ser un archivo pequeño como 20 KB o 25 KB o menos. Tuve el mismo problema, pero cuando reduzco el archivo que comienza a funcionar.

aplausos

Fuente

2012-01-09 09:16:02 xmux

pantalla web iPhone splash no funciona

Respuesta

Cuestiones relacionadas