The header of my web application looks like this:
- <!DOCTYPE html>
- <html class="ui-mobile landscape min-width-320px min-width-480px min-width-768px min-width-1024px">
- <head>
- <title>WWF Seafood Guide</title>
- <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
- <link href="js/images/homescreen.gif" rel="apple-touch-icon" />
- <link rel="js/images/homescreen.gif" sizes="72x72" href="images/homescreen.gif" />
- <link rel="js/images/homescreen.gif" sizes="114x114" href="images/homescreen.gif" />
- <link href="js/images/startup.png" rel="apple-touch-startup-image" />
- <meta name="apple-mobile-web-app-capable" content="yes" />
- <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
- <link rel="stylesheet" href="js/add2home.css" type="text/css" />
- <link rel="stylesheet" href="js/jquery.mobile-1.0a4.1.min.css" type="text/css" />
- <link rel="stylesheet" href="js/custom.css" type="text/css" />
- <script type="text/javascript" src="js/add2home.js"></script>
- <script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
- <script type="text/javascript" src="js/jquery.mobile-1.0a4.1.min.js"></script>
- <script src="SpryAssets/xpath.js" type="text/javascript"></script>
- <script src="SpryAssets/SpryData.js" type="text/javascript"></script>
- <script type="text/javascript">
- var species = new Spry.Data.XMLDataSet("species_bak.xml", "asiandiver_wwf/species_entries", {sortOnLoad: "common_name", sortOrderOnLoad: "ascending"});
- </script>
- </head>
- ...
- ...
What can I remove or what do I need to add for smooth working in phonegap (iOS 4+)?
I think the icons and homescreens (because phonegap creates its own) for example? I also recognized, that the iPhone simulator does not show the black status bar. And the status bar shows also up during startup. So, the startup.png gets cropped on top. I got from somewhere a js called "phonegap.js". Do I need to integrate an additional js for phonegap?
Cheers
Ralph