The jQuery Project team has developed a JavaScript and CSS framework targeted at mobile devices. The jQuery Mobile (JQM) project include a set of JavaScript, CSS, and images to apply style and behavior to a web page that is similar to a mobile application such as an iPhone app. As of time of this post the jQuery Mobile Framework is available in a alpha version.
I have created a simple web site consisting of three XHTML pages that mimic a simple contact management web application. Note that I have only created a bare bones front-end that uses only XHTML markup, it does not contain any JavaScript, images, CSS, or a back-end database. I will demonstrate how JQM and HTML 5 markup has been added to each page to add the JQM framework.
index.html
The home page for the site is list of contacts that displays each contacts phone number, email address and link to more information. Please note that each contact links to the same details page.
detail.html
This page lists detailed information for a contact.
form.html
This page allows entry of a new contact. It is here to demonstrate the styling and behavior that JQM applies to form elements.
References
jQuery Mobile Project
http://jquerymobile.com/
XHTML Contacts Site
http://www.customdatasys.com/jqm/start/
jQuery Mobile Contacts Site
http://www.customdatasys.com/jqm/v1/
No comments:
Post a Comment