schermata di avvio applicazione iPhone web

Question

sto lavorando su una web app iPhone dove sto utilizzando la "mela-mobile-web-app-capable" meta tag per ottenere "modalità a schermo intero". Quando ho lauch l'applicazione mostra una foto della pagina in cui ho lasciato l'ultima volta mentre si carica. Sembra che l'applicazione è pronta per ricevere l'input quando non lo è, e questo è fonte di confusione.

E 'possibile modificare il comportamento predefinito e mostrare uno schermo in bianco fino a quando non è pronto a ricevere l'input?

Answer 1

mettere questo tra i tag HEAD:

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

L'immagine utilizzata deve essere in formato JPG o PNG con una risoluzione di 320x460

Answer 2

Questo aggiungerà una schermata iniziale per il Web App. Qui di seguito sono le dimensioni di cui ha bisogno per iPad (sia retina e non), iPhone / iPod Touch (retina e non), e iPhone 5. Questi includono l'area di barra di stato pure.

di Apple Documenti-Launch Images , Apple ha Docs-icona e immagine Dimensioni          

<!-- 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">

Se la creazione di una web app per la compatibilità iPad è consigliabile che entrambe le dimensioni del paesaggio e del ritratto sono utilizzati.

Answer 3

E 'DEVE essere 320x460, non funzionerà se 320x480.

Answer 4

L'immagine deve essere PNG e 320x460 questo funziona solo in iPhone OS 3.0 o superiore.