jquery / jquery-ui

Source
Commits
Network (27)
Graphs
Tree: 7443cb8

The official jQuery user interface library. — Read more

This URL has Read+Write access

Menu: Testing nested menus without the DOM restructuring, just need to fix 
display issue in IE6

jzaefferer (author)

Mon Mar 22 21:10:54 -0700 2010

commit 7443cb8e40925bea435a32613c4ff40d1d9c7f5f
tree 81407011471bc2d2b7919d42de8076cd0b779f56
parent e7c2eb42d08c5ee7b444c3c0274758df46202dfb

tests/visual/menu/nested2.html

103 •••••

tests/visual/menu/nested2.html

...

0
@@ -0,0 +1,103 @@
0
+<!doctype html>
0
+<html>
0
+<head>
0
+  <title>Menu Visual Test: Default</title>
0
+  <link rel="stylesheet" href="../visual.css" type="text/css" />
0
+  <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
0
+  <script type="text/javascript" src="../../../jquery-1.4.2.js"></script>
0
+  <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
0
+  <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
0
+  <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
0
+  <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
0
+  <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.1.js"></script>
0
+  <script type="text/javascript">
0
+  $(function() {
0
+    $.fn.position2 = function(options) {
0
+      return this.css({
0
+        top: 0,
0
+        left: 0
0
+      }).position(options);
0
+    }
0
+    var menus = $("#menu").menu().position2({
0
+      my: "left top",
0
+      at: "center bottom",
0
+      of: "button"
0
+    }).find("ul").menu().hide();
0
+    var sub1 = menus.filter(":first").show().position2({
0
+      my: "left top",
0
+      at: "right center",
0
+      of: "#menu"
0
+    });
0
+    sub1.find("ul:first").show().position2({
0
+      of: sub1,
0
+      offset: "-10 50"
0
+    });
0
+  });
0
+  </script>
0
+  <style>
0
+    body { font-size:62.5%; }
0
+    .ui-menu { width: 200px; position: absolute; }
0
+    .ui-menu .ui-icon { float: right; }
0
+    ul, li {margin: 0; padding: 0}
0
+  </style>
0
+</head>
0
+<body>
0
+  
0
+<button>Show context menu</button>
0
+<br/>
0
+<select>
0
+  <option>some option with some text</option>
0
+</select>
0
+
0
+<ul id="menu">
0
+  <li>
0
+    <a href="#">Amsterdam</a>
0
+    <ul>
0
+      <li><a href="#">Aberdeen</a></li>
0
+      <li><a href="#">Ada</a></li>
0
+      <li>
0
+        <a href="#">Adamsville</a>
0
+        <ul>
0
+          <li><a href="#">Anaheim</a></li>
0
+          <li>
0
+            <a href="#">Cologne</a>
0
+            <ul>
0
+              <li><a href="#">Mberdeen</a></li>
0
+              <li><a href="#">Mda</a></li>
0
+              <li><a href="#">Mdamsville</a></li>
0
+              <li><a href="#">Mddyston</a></li>
0
+              <li><a href="#">Mmesville</a></li>
0
+            </ul>
0
+          </li>
0
+          <li><a href="#">Frankfurt</a></li>
0
+        </ul>
0
+      </li>
0
+      <li><a href="#">Addyston</a></li>
0
+      <li><a href="#">Amesville</a></li>
0
+    </ul>
0
+  </li>
0
+  <li><a href="#">Anaheim</a></li>
0
+  <li><a href="#">Cologne</a></li>
0
+  <li><a href="#">Frankfurt</a></li>
0
+  <li>
0
+    <a href="#">Magdeburg</a>
0
+    <ul>
0
+      <li><a href="#">Mberdeen</a></li>
0
+      <li><a href="#">Mda</a></li>
0
+      <li><a href="#">Mdamsville</a></li>
0
+      <li><a href="#">Mddyston</a></li>
0
+      <li><a href="#">Mmesville</a></li>
0
+    </ul>
0
+  </li>
0
+  <li><a href="#">Munich</a></li>
0
+  <li><a href="#">Utrecht</a></li>
0
+  <li><a href="#">Zurich</a></li>
0
+</ul>
0
+
0
+<div class="ui-widget" style="margin-top:2em; font-family:Arial">
0
+  Log:
0
+  <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
0
+</div>
0
+
0
+</body>
0
+</html>

Comments

Please log in to comment.