aboutsummaryrefslogtreecommitdiffstats
path: root/demos/menu/topalignmenu.html
diff options
context:
space:
mode:
Diffstat (limited to 'demos/menu/topalignmenu.html')
-rw-r--r--demos/menu/topalignmenu.html80
1 files changed, 80 insertions, 0 deletions
diff --git a/demos/menu/topalignmenu.html b/demos/menu/topalignmenu.html
new file mode 100644
index 000000000..b3c7c6956
--- /dev/null
+++ b/demos/menu/topalignmenu.html
@@ -0,0 +1,80 @@
+<!doctype html>
+<html>
+<head>
+ <title>Menu Demo: Top-aligned Menu</title>
+ <link rel="stylesheet" href="../demos.css" type="text/css" />
+ <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
+ <script type="text/javascript" src="../../jquery-1.5.1.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.menu.js"></script>
+ <script type="text/javascript">
+ $(function() {
+ $("#topMenu").menu({
+ position: { of: "ul:has(a.ui-state-focus):last" }
+ });
+ });
+ </script>
+ <style>
+ .ui-menu { width: 200px; margin-bottom: 2em; }
+ </style>
+</head>
+<body>
+
+<ul id="topMenu">
+ <li><a href="#">Aberdeen</a></li>
+ <li><a href="#">Ada</a></li>
+ <li><a href="#">Adamsville</a></li>
+ <li><a href="#">Addyston</a></li>
+ <li>
+ <a href="#">Delphi</a>
+ <ul>
+ <li><a href="#">Ada</a></li>
+ <li><a href="#">Saarland</a></li>
+ <li><a href="#">Salzburg</a></li>
+ </ul>
+ </li>
+ <li><a href="#">Saarland</a></li>
+ <li>
+ <a href="#">Salzburg</a>
+ <ul>
+ <li>
+ <a href="#">Delphi</a>
+ <ul>
+ <li><a href="#">Ada</a></li>
+ <li><a href="#">Saarland</a></li>
+ <li><a href="#">Salzburg</a></li>
+ </ul>
+ </li>
+ <li>
+ <a href="#">Adamsville</a>
+ <ul>
+ <li><a href="#">Aberdeen</a></li>
+ <li><a href="#">Ada</a></li>
+ <li><a href="#">Adamsville</a></li>
+ <li><a href="#">Addyston</a></li>
+ <li>
+ <a href="#">Delphi</a>
+ <ul>
+ <li><a href="#">Ada</a></li>
+ <li><a href="#">Saarland</a></li>
+ <li><a href="#">Salzburg</a></li>
+ </ul>
+ </li>
+ <li><a href="#">Saarland</a></li>
+ </ul>
+ </li>
+ <li><a href="#">Perch</a>
+ <ul>
+ <li><a href="#">Addyston</a></li>
+ <li><a href="#">Delphi</a></li>
+ <li><a href="#">Perch</a></li>
+ </ul>
+ </li>
+ </ul>
+ </li>
+</ul>
+
+</body>
+</html>