iPhone Web App splash screen delay

Question

I've built an iPhone web app and have done all the steps to make it look like a native app: app icon, prevent scrolling, prevent selection, use touch-based js methods, etc. However, I'm having a tough time with the splash screen.

I have tried a 320x460 PNG and JPEG, cached with a manifest file. The splash image does appear, but only after a few seconds after the app launches with a white screen. So, really the splash screen shows up only for a fraction of a second before the app finishes launching.

I can't figure out why it isn't loading the splash immediately. I know it is cached by the manifest because it loads without an internet connection. I read before that the splash doesn't show up until the DOM is ready, so I'm guessing that's the problem, but I don't know how to fix it.

Answer 1

Are you inserting it with the startup link?

<link rel="apple-touch-startup-image" href="startup-graphic.png" />

I also found that sometimes when I made changes to my iPhone web apps I had to completely remove the link on the home-screen and go through the process of adding it again before some of the elements updated properly - even after updating the cache-manifest.