Dialogs

Any page can be presented as a dialog by adding the data-rel="dialog" attribute to the page you're linking to. The framework will add styles to make the page look like a modal dialog by adding rounded corners and margins around the page along with a dark background behind the "dialog".

The dialog will still open with the standard slide transition so to make it feel more dialog-like, we recommend adding a transition of pop, slideup or flip on the link too.


<a href="foo.html" data-rel="dialog" data-transition="pop">Open dialog</a>
Open dialog: pop Open dialog: slideup Open dialog: flip