HTML and CSS Reference
In-Depth Information
Single Page
As previously mentioned, the single-page approach forces you to put as much markup
and resources as possible into a single HTML file. In the end, this limits HTTP requests
for a better performing app. The leaders here are jQuery Mobile and jQTouch.
jQuery Mobile
jQuery Mobile ( ; demo at ) is strict‐
ly tied to the release schedule of the core jQuery library. Known for its AJAX-based
navigation system and themeable ThemeRoller designs, the framework is produced by
the core jQuery project. It also has an attractive set of widgets, but unfortunately, they're
all decorated with CSS background gradients, text shadows, rounded corners, and drop
shadows. As you'll see in the coming chapters, heavy use of CSS decorations in mobile
web apps can slow the browser to a crawl.
jQuery Mobile is the most popular mobile web framework out there today. Taking into
account its over 10,000 followers on Twitter and more than 6,000 watchers on github
( Figure 3-14 ), you can easily see the power piggy-backing on an existing project's success
(in this case, core jQuery) to catapult a project into the mainstream. The real power and
strength of this project comes from its community. Table 3-1 gives a high-level snapshot
of the jQuery Mobile project.
Figure 3-14. jQuery Mobile github stats, June 2012
Table 3-1. jQuery Mobile
Platform support
Android, bada, BlackBerry, iOS, MeeGo, Symbian, webOS, and Windows Phone (others are
graded at different levels of 49 support)
Dual license MIT or GPL 2
Programming model
CSS and JavaScript: declarative on the DOM itself; markup with CSS and data-* attributes
Wrapped or polyfilled HTML5
To set up the page, use the code:
<!DOCTYPE html>
<title> My Page </title>
<meta name= "viewport" content= "width=device-width, initial-scale=1" >
<link rel= "stylesheet" href= "/" />
<script type= "text/javascript" src= "/jquery-1.6.4.min.js" ></script>
<script type= "text/javascript" src= " /" ></script>
Search WWH ::

Custom Search