This is the second version of this post. I realized late that version 1.1.1 of jQuery Mobile had been released three days ago. Since it fixes a lot of issues, I made corrections to the post and the source code to support it.
The JQM Skeleton project has been updated with a few niceties to make it friendlier to mainly to iPhones, but it also helps Android phones.
The first thing that I changed was the jQuery Mobile plugin from version 1.1.0 to 1.1.1. I just released this version went final. This fixes a lot of issues, especially for the PhoneGap lovers out there.
Apple Web App
We already had the meta tag for supporting Apple’s web app functions set to true. In order to make most use of it I also added support for the iPhone and iPad variety of icons. The icons are a big nicety for your users since if they add your site to their home screen, it will give them an icon which looks like any other app on their screen. In the same vein, I added support for the iPhones start-up image. This is a splash page which if it exist on your site and your site is home screen’ed, will be downloaded to the user’s phone. When the user launches your site next, the splash page is shown while your site is downloaded to the user’s phone. All of these modifications, make your site very app-like to your users.
One interesting thing for Android 2.2 and higher users is that the home page will also read Apple’s apple-touch-icon attribute and use the big icon file on the home page instead of either favicon.ico or the generic star icon. Android will even give it rounded corners.
I added favicon.ico to the root directory and I also added a link to it in the <head> section. While most browsers will pick it from the root, the link helps ensure that it is found.
That’s it for this update. There will be another one in a few weeks as I put more support for the iPad in it, plus a few other things that I am playing around with now. The source, as always, is on GitHub: https://github.com/Rockncoder/JQMSkeleton.