Skip to content
Permalink
Browse files

Dialog: Added demos for buttons and modal.

  • Loading branch information
scottgonzalez committed Dec 29, 2008
1 parent 9d78a89 commit 94c4bcde691781c91df1c3a69063cfa17dc88c2a
Showing with 82 additions and 0 deletions.
  1. +35 −0 demos/dialog/buttons.html
  2. +2 −0 demos/dialog/index.html
  3. +45 −0 demos/dialog/modal.html
@@ -0,0 +1,35 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Dialog - Buttons Demo</title>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<link type="text/css" href="../../themes/default/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../ui/ui.draggable.js"></script>
<script type="text/javascript" src="../../ui/ui.resizable.js"></script>
<script type="text/javascript" src="../../ui/ui.dialog.js"></script>
<script type="text/javascript">
$(function() {
$("#dialog").dialog({
buttons: {
Ok: function() {
alert('You clicked Ok!');
},
Cancel: function() {
alert('You clicked Cancel. The dialog will now close.');
$(this).dialog('close');
}
}
});
});
</script>
</head>
<body>

<div id="dialog" title="Curabitur augue">
<p>Sed vel diam id libero rutrum convallis. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
</div>

</body>
</html>
@@ -9,6 +9,8 @@
<dl class="nav">
<dt>Dialog</dt>
<dd><a href="default.html">Default</a></dd>
<dd><a href="buttons.html">Buttons</a></dd>
<dd><a href="modal.html">Modal</a></dd>
</dl>

</body>
@@ -0,0 +1,45 @@
<!doctype html>
<html lang="en">
<head>
<title>jQuery UI Dialog - Modal Demo</title>
<link type="text/css" href="../demos.css" rel="stylesheet" />
<link type="text/css" href="../../themes/default/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
<script type="text/javascript" src="../../ui/ui.draggable.js"></script>
<script type="text/javascript" src="../../ui/ui.resizable.js"></script>
<script type="text/javascript" src="../../ui/ui.dialog.js"></script>
<script type="text/javascript">
$(function() {
$("#dialog").dialog({
modal: true,
overlay: {
backgroundColor: '#000',
opacity: 0.5
}
});
});
</script>
</head>
<body>

<div id="dialog" title="Curabitur augue">
<p>Sed vel diam id libero rutrum convallis. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
</div>

<div>
<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
<form>
<input value="text input" /><br />
<input type="checkbox" />checkbox<br />
<input type="radio" />radio<br />
<select>
<option>select</option>
</select><br />
<textarea>textarea</textarea><br />
</form>
</div>
</body>
</html>

0 comments on commit 94c4bcd

Please sign in to comment.
You can’t perform that action at this time.