In a multi-page template application, the HTML file will have multiple pages in it. Each page is wrapped within a page container as <div data-role="page">
. The page ID is used to identify the pages for linking or invoking any actions on them. The page ID must be unique within your app. When you launch the app, the jQuery Mobile framework loads all the available pages into the DOM and displays the first page it finds in the HTML. Navigation between the pages is specified by using anchor links, and you can decorate these links as buttons by using the data-role="button"
attribute. On clicking any link, navigation occurs with some cool CSS3 transitions, and the new page is pulled in via Ajax. This recipe shows ...
No credit card required