iPhone Web App Startbildschirm

Question

Ich arbeite an einer iPhone Web App, wo ich das "Apple-Mobile-Web-App-fähige" Meta-Tag verwende, um den "Vollbildmodus" zu erhalten. Wenn ich die App lauge zeigt es ein Bild von der Seite, auf der ich das letzte Mal beim Laden gegangen bin. Es scheint, dass die App bereit ist, Eingaben zu empfangen, wenn dies nicht der Fall ist, und das ist verwirrend.

Ist es möglich, das Standardverhalten zu ändern und einen leeren Bildschirm anzuzeigen, bis er Eingaben empfangen kann?

Answer 1

put diese zwischen Ihrem Kopf tags:

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

Das Bild, das Sie mit einer Auflösung von 320x460 JPG oder PNG sein

Answer 2

Das Bild PNG verwenden muss sein muss und 320x460 dies nur unter iPhone OS arbeitet 3.0 oder höher.

Answer 3

Es muss 320x460 sein, es wird nicht funktionieren, wenn es 320x480 ist.

Answer 4

Dadurch wird Ihrer Web App ein Begrüßungsbildschirm hinzugefügt. Unten sind die Größen, die Sie für iPad (beide Retina und nicht), iPhone/iPod Touch (Retina und nicht) und iPhone 5 benötigen. Dazu gehören auch die Statusleiste.

Apple Docs-Launch Images, Apple Docs-Icon and Image Sizes

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

Wenn eine Web-App für das iPad Kompatibilität zu schaffen ist es empfohlen, dass sowohl Landschafts- und Portrait Größen verwendet werden.