javascript - jQuery mega Dropbox 菜单

Question

我目前正在研究大型 Dropbox 菜单。我的第一个想法是使用 LIs 作为菜单，然后在某处为 megamenu 的内容定义 DIV：

<ul>
    <li class="menu" id="test_menu">Test</li>
</ul>

<div id="test_supermenu">
  <!-- Content here -->
</div>

这个jQuery代码：

jQuery(document).ready(function() {
  jQuery("li.menu").hover(function() {
    jQuery("#test_supermenu").position({
      my: "center",
      at: "bottom",
      of: "#test_menu"
    });
    jQuery("#test_supermenu).show();
  }, function() {
    jQuery("#test_supermenu).hide();
  });
});

问题是，当您离开 LI 并尝试在 DIV 超级菜单中选择某些内容时，超级菜单会被隐藏。这是可以预料的，但我该如何避免呢？

第二个想法是在一个大 DIV 中设计菜单和超级菜单：

<div id="menu">
   <a href="">Test</a>
   <div id="supermenu">
     <! -- Content here -->
   </div>
</div>

但问题仍然存在。

你能给我一个如何解决这个问题的建议吗？非常感谢。