Home Page

Hello Mobile World !

External Pages

Transitions

Fade to the second page

Flip to the second page

Pop to the second page

Slide to the second page

Slideup to the second page

Slidedown to the second page

Dialogs

Go to the page : dialog

Toolbars

Go to the page : toolbars

Navigation Bars

Go to the page : navigation bars

Positioned Toolbars

Go to the page : positioned toolbars

Buttons

Go to the page : buttons

Forms

Go to the page : forms basic

Go to the page : text and search inputs

Footer

Page Transitions

Second Page

Go to the first page

Footer

Dialogs

Content of the dialog page

Go to the first page

Dialog Footer

Home

Toolbars and buttons

Options

Content of the toolbars page

Go to the first page

Button 1 Button 2 Button 3

Navigation Bars 1

Content of the navigation bars page 1

Go to the home page

Footer

Navigation Bars 2

Content of the navigation bars page 2

Go to the home page

Footer

Positioned Toolbars

Three types

Inline

default setting

Fixed

data-position="fixed" in the data-role="header" and data-role="footer" section ( this page )

toolbars ( header and footer ) disappear when scrolling.

but reappear when scrolling stops, tapping the screen will show/hide the bars

Fullscreen

data-position="fixed" in the data-role="header" and data-role="footer" section and data-fullscreen="true" in the data-role="page" defenition

same as fixed but the content of the page takes up the entire screen, toolbars are sitting over the content.

Page must be long enough

Go to the home page

Footer

Buttons

button element

Link styled as a button

Button Link

vertical vs. inline

Button 1 Button 2 Button 3 Button 4

buttons in a controlgroup

data-type vertical(=default)

data-type horizontal

buttons with icons

Up Down Left Right

Delete Home Alert Grid Star Search Check Info Forward Back Refresh

Go to the home page

Footer

Forms basics

Go to the home page

Footer

Text and search inputs

Go to the home page