jQuery Mobile - Dialogs Page



Modal dialogs open content in an interactive overlay above the page.

Following table demonstrates the types of dialogs pages in detail.

Sr.No. Type & Description
1 Basic Dialogs

Include attribute data-dialog = "true" to any page to display a dialog.

2 Transitions

The transition plugin provides a simple transition effect.

3 Closing Dialogs

The closing button can be set at the right side by adding data-close-btn = "right" to the dialog container.

4 Chaining Dialogs

The data-rel = "back" attribute is used to navigate to go back to the previous dialog.

5 Styling & theming

Different styling and theming can be applied to a dialog.

6 Dialog width and margins

By default, the dialog width and margin is set.