Edit Question - KnowledgeHub

Title Body

I have a very simple HTML5 iPhone web application that works almost perfectly; there is only one issue: between the launch image and the app homescreen, a completely white screen appears (i.e. flickers) for about one second. I'm downloading the app to my phone from the web by using the "Add to Home Screen" button. The javascript file ( functions.js ) and stylesheet are both very small files. Has anyone had this problem? Are there any ways to work around/fix it? index.html <!doctype html> <html manifest="demo.manifest"> <head> <meta charset="UTF-8"> <title>HTML5 Application</title> <link rel="stylesheet" type="text/css" href="style.css" /> <link rel="apple-touch-icon-precomposed" href="Icon@2x.png" /> <link rel="apple-touch-startup-image" href="Default@2x.png" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="viewport" content="user-scalable=no, width=device-width" /> </head> <body> <div id="wrapper">...</div> </body> <script type="text/javascript" src="function.js"></script> </html> demo.manifest CACHE MANIFEST index.html Default@2x.png functions.js style.css .htaccess AddType text/cache-manifest .manifest EDIT #1 : I have done some more research and came upon this answer : Clearing the screen and other artifacts while rendering is a common issue of HTML rendering due to the progressive nature of HTML. The concept is that the browser should draw as early and often as possible and render styles/scripts/content as they become available. It's possible the markup has an issue

Tags (comma-separated) Cancel