Review: Mobile Web development frameworks face off
jQuery Mobile, Sencha Touch, Kendo UI, and Intel App Framework bring a native look and feel to Web apps for mobile devicesFollow @peterwayner
In a world where jQuery rules, it helps to wear the royal name: jQuery Mobile. The framework is more of a brand extension than a real extension to jQuery because the goal is to provide a good framework for creating Web apps for mobile browsers. While jQuery is required, most of the work is done in HTML and CSS.
CSS is also a big part of the equation. If you're going to build out your user interface, you start adding DIVs and giving them CSS class names that, in turn, give the DIVs the style you choose. Using the built-in CSS definitions ensures a consistent look. Departing from them can get tricky if you don't understand how some of the floats work. The standard styles, though, are quite plain. I'm sure some will even call them boring.
There are all of the usual widgets, and they end up emulating most of what people can do with the native tools. The nice drawer feature that hides a panel of buttons behind everything is implemented and ready. All you need to do is create a DIV with the data display attribute set to "reveal." The code does the rest. A substantial amount of the code is created simply by adding these attributes. jQuery Mobile embraces the "data-" nomenclature from HTML5.
The adequate documentation is saved by a rich collection of examples. The trickiest part I found was figuring out how all the DIVs need to be nested. If you plunk a DIV down in the wrong place, it will start inheriting weird behavior thanks to the interplacement of the HTML and the CSS. While it doesn't take much knowledge of CSS to knock off some basic designs, you have to start thinking about it if you want to create something more elaborate. Most people don't think of CSS as a programming language per se, but I did after monkeying with these pages for a bit.
jQuery Mobile is an open source project with a generous MIT license.
jQuery Mobile development can be done in your browser with your browser's debugger.