For last month I am using jquery mobile. I’ve gone through lots of issues and learned a lot.
Web is good but when it comes with browser, HTML and java-scripts it becomes more buggy!
Generally I use chrome for development, and jquery mobile works perfect as it based on web-kit.
I tested and published my code, for desktop testing I use Firefox and chrome (not testing on IE as its jquery mobile). But when I open it in Android device, I see only half of the page rendering. And this is because of I made mistake in mark up language.
I forgot to close div tag and closed with li tag. In Firefox and chrome its ignored, but in safari it rendered differently.
See this code and output in chrome and safari, you will get the idea what i’m taking about.
Conclusion: While testing you web app IE is your acid test, while targeting web-kit or jquery mobile, safari is your acid test.
I am working on a huge business application. Currently major work is done by web application built on ColdFusion. But now we have created iPhone and Android application. Both are built on native platform, but now we can’t ignore blackberry and Symbian OS users.
So we’ve decided to work on platform independent framework, and that is PhoneGap.
I tell you that jQuery Mobile are working so hard that they differentiated touch, click swipe events very nicely. So I strongly recommend both the framework for your mobile application.
Coming to the title point, jQuery Mobile gave B grade the BlackBerry OS 5.0 native browser, as it lacks some of the important features. But as of now there are about 50% blackBerry users have OS 5.0. So while developing an business application, we can’t exclude them, so I decided to start working on the issues and try to remove them.
First of all, I realize that BlackBerry 5.0 browser doesn’t support URL hash change event. and it is a main disaster for JQM. So I and eventually JQuery Mobile team thought that, we should remove ajax call for BB5, and they made it! Excellent huh!.
If you are using Firefox 3.6 or above version, then you can enable html5 rendering by changing the configuration of Firefox.
Type about:config in address bar.
Type html5.enable in filter, and double click to set the value true.
Enjoy the HTML5!
To test the page, please create a page named html5.html, and paste the following code:
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>SVG in text/html</title>
<p>A green circle:<svg> <circle r="50" cx="50" cy="50" fill="green"></circle></svg></p>
Save the page and open it in Firefox, you should be able to see green circle!
More information about html5 is here.