JQuery JQueryMobile

Concepts

jMobile web pages consist of different pages:

<div data-role="page" id="p1">content p1</div> 
 <div data-role="page" id="p2">content p2</div>

API

• $() is short of jQuery()
• uses the data-role attribute

data-roles

footer role

data-position="fixed"

listview role

data-inset="true" // creates margins around the list within a content area

page role

data-theme="[a|b|c]" define standard colors and fonts

<a>

data-icon="[home|grid|info]"
data-iconpos="notext"
data-transition="slidedown" // defines the optical transition to another page

<ul>

data-role="listview"
data-filter="true" // makes the list searchable

Resources

• personal account
• jQuery mobile examples