pantalla de inicio de aplicaciones web para el iPhone

Question

Estoy trabajando en una aplicación web para el iPhone donde yo estoy usando la "manzana-móvil-web-app-capaz" etiqueta meta de conseguir "el modo de pantalla completa". Cuando LAUCH la aplicación que muestra una imagen de la página donde lo dejé la última vez mientras se carga. Parece que la aplicación está lista para recibir la entrada cuando no lo es, y eso es confuso.

¿Es posible cambiar el comportamiento predeterminado y mostrar una pantalla en blanco hasta que está listo para recibir la entrada?

Answer 1

poner esto entre sus etiquetas HEAD:

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

La imagen que use debe ser JPG o PNG con una resolución de 320x460

Answer 2

Esto añadirá una pantalla de bienvenida a su aplicación web. A continuación se presentan los tamaños que usted necesita para iPad (tanto retina y no), el iPhone / iPod Touch (retina y no), y el iPhone 5. Estos incluyen el área de barra de estado también.

de Apple Docs-Launch imágenes , Apple-Docs icono y los tamaños de imagen          

<!-- iPhone (Retina) -->
<link href="http://www.example.com/mobile/images/apple-startup-iPhone-RETINA.jpg" media="(device-width: 320px) and (device-height: 480px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

<!-- iPhone 5 -->
<link href="http://www.example.com/mobile/images/apple-startup-iPhone-Tall-RETINA.jpg"  media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

<!-- iPad Portrait -->
<link href="http://www.example.com/mobile/images/apple-startup-iPad-Portrait.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">

<!-- iPad Landscape -->
<link href="http://www.example.com/mobile/images/apple-startup-iPad-Landscape.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 1)" rel="apple-touch-startup-image">

<!-- iPad Portrait (Retina) -->
<link href="http://www.example.com/mobile/images/apple-startup-iPad-RETINA-Portrait.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

<!-- iPad Landscape (Retina) -->
<link href="http://www.example.com/mobile/images/apple-startup-iPad-RETINA-Landscape.jpg" media="(device-width: 768px) and (device-height: 1024px) and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image">

Si la creación de una aplicación web para la compatibilidad del iPad se recomienda que se utilizan ambos tamaños horizontal y vertical.

Answer 3

TIENE que ser 320x460, no va a funcionar si es 320x480.

Answer 4

La imagen debe ser PNG y 320x460 esto funciona sólo en el iPhone OS 3.0 o superior.