mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-03-19 07:20:24 +00:00
38 lines
No EOL
1.4 KiB
HTML
Executable file
38 lines
No EOL
1.4 KiB
HTML
Executable file
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>jQuery Mobile Docs - Pages</title>
|
|
<link rel="stylesheet" media="only all" href="../../css/all" />
|
|
<script type="text/javascript" src="../../js/all"></script>
|
|
</head>
|
|
<body>
|
|
|
|
<div data-role="page">
|
|
|
|
<div data-role="header">
|
|
<h1>Dialogs</h1>
|
|
</div><!-- /header -->
|
|
|
|
<div data-role="content" class="ui-body">
|
|
|
|
<p>Any page can be presented as a dialog by adding the </a>data-rel="dialog"</code> 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".</p>
|
|
|
|
<p>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.</p>
|
|
|
|
<pre><code>
|
|
<a href="foo.html" data-rel="dialog" data-transition="pop">Open dialog</a>
|
|
</pre></code>
|
|
|
|
<a href="dialog.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="pop">Open dialog: pop</a>
|
|
<a href="dialog.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="slideup">Open dialog: slideup</a>
|
|
<a href="dialog.html" data-role="button" data-inline="true" data-rel="dialog" data-transition="flip">Open dialog: flip</a>
|
|
|
|
|
|
|
|
|
|
|
|
</div><!-- /content -->
|
|
</div><!-- /page -->
|
|
|
|
</body>
|
|
</html> |