summaryrefslogtreecommitdiffstats
path: root/demos
diff options
context:
space:
mode:
authorFelix Nagel <info@felixnagel.com>2011-10-24 21:24:59 +0200
committerFelix Nagel <info@felixnagel.com>2011-10-24 21:24:59 +0200
commitb712d9c73e79f9cfc081211e08ac9722546d12f2 (patch)
treebc5b57502c5e89c2ed858739e377c060bd08adb3 /demos
parentce7e9304a0970cbaba859cb36135a89d46806c32 (diff)
downloadjquery-ui-b712d9c73e79f9cfc081211e08ac9722546d12f2.tar.gz
jquery-ui-b712d9c73e79f9cfc081211e08ac9722546d12f2.zip
added: dialog.html demo file
Diffstat (limited to 'demos')
-rw-r--r--demos/selectmenu/dialog.html177
1 files changed, 177 insertions, 0 deletions
diff --git a/demos/selectmenu/dialog.html b/demos/selectmenu/dialog.html
new file mode 100644
index 000000000..a063b82c6
--- /dev/null
+++ b/demos/selectmenu/dialog.html
@@ -0,0 +1,177 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+ <title>Demo Page for jQuery UI selectmenu</title>
+
+ <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
+ <link type="text/css" href="../../themes/base/jquery.ui.selectmenu.css" rel="stylesheet" />
+ <script type="text/javascript" src="../../jquery-1.6.2.js"></script>
+ <script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
+ <script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
+ <script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
+
+ <script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script>
+ <script type="text/javascript" src="../../ui/jquery.ui.selectmenu.js"></script>
+
+ <style type="text/css">
+ /* demo styles */
+ body {font-size: 62.5%; font-family:"Verdana",sans-serif; }
+ fieldset { border:0; }
+ label,select,.ui-select-menu { float: left; margin-right: 10px; }
+ select { width: 200px; }
+ .wrap span.ui-selectmenu-item-header,
+ .wrap ul.ui-selectmenu-menu li a { text-decoration: underline !important; }
+ </style>
+ <script type="text/javascript">
+ $(function(){
+ $('select#speed').selectmenu();
+
+ var myDialog = $( "#dialog" ).dialog({
+ autoOpen: false
+ });
+
+ $('select#speed2').selectmenu({
+ style: "popup"
+ });
+
+ $("#open").click(function(){
+ myDialog.dialog("open");
+ return false;
+ });
+ });
+ </script>
+</head>
+<body>
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+
+ <a id="open" href="#nogo">Open Dialog with Selectmenu</a>
+ <div id="dialog" title="Basic dialog">
+ <p>Some example content</p>
+ <p><a href="#nogo">Test Link</a></p>
+ <form action="#">
+ <fieldset>
+ <label for="speed">Select a speed:</label>
+ <select name="speed" id="speed">
+ <option value="Slower">Slower</option>
+ <option value="Slow">Slow</option>
+ <option value="Medium" selected="selected">Medium</option>
+ <option value="Fast">Fast</option>
+ <option value="Faster">Faster</option>
+ </select>
+ </fieldset>
+ <fieldset>
+ <label for="speed2">Select a speed:</label>
+ <select name="speed2" id="speed2">
+ <option value="Slower">Slower</option>
+ <option value="Slow">Slow</option>
+ <option value="Medium" selected="selected">Medium</option>
+ <option value="Fast">Fast</option>
+ <option value="Faster">Faster</option>
+ </select>
+ </fieldset>
+ </form>
+ </div>
+
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+ <br /><br /><br /><br /><br />
+</body>
+</html> \ No newline at end of file