自定义jQuery子菜单定位 [英] Customize jQuery submenu positioning

问题描述

我试图创建一个水平菜单，它至少有两级子菜单。所有子菜单都是垂直的。

I am trying to create a horizontal menu that has at least two levels of submenus. All submenus are vertical.

子菜单1将直接在其父菜单的下方。
所有后续子菜单级别（2+）应该在其父级的右侧。

Submenu1 will be directly below its parent. All subsequent submenu levels (2+) should be to the right of its parent.

我刚开始学习如何使用jQuery菜单，似乎没有为此定制。我不知道如何解决这个问题...我试图在 $（＃myMenu .level1）上调用 .menu（）

I am just starting to learn how to use jQuery menu, and they don't seem to have a customization for this. I am not sure how to approach this... I tried and failed to call .menu() on $("#myMenu .level1").

我的问题是 - 如果有人能指出我正确的方向如何做菜单，上面。

My question is - I would much appreciate if someone can point me in the right direction on how to make the menu as I have stated above.

JavaScript代码段

Javascript snippet

<script>
  $(function() {
    $("#myMenu").menu({
      position: {
        my: "left top",
        at: "left bottom"
      }
    });
  });
</script>

HTML片段

<ui id="myMenu">
  <li class="level1">
    <a href="#">Item 1</a>
    <ul>
      <li class="level2">
        <a href="#">Item 1</a>
        <ul>
          <li class="level3">
            <a href="#">Item 1</a>
          </li>
        </ul>
      </li>
    </ul>
  </li>

更新： JSbin

推荐答案

你最后我有一个答案你的问题。使用菜单的一些属性，如模糊和焦点。我发现此页面已包含解决方案 http：// forum.jquery.com/topic/how-to-make-the-perfect-horizo​​ntal-menu 。我研究那些行，并在你的代码中应用它。

Hi finally i have an answer for your question. Using some properties of the menu like blur and focus. I found this page that already has the solution http://forum.jquery.com/topic/how-to-make-the-perfect-horizontal-menu. I studied those lines and applied it in your code. If you have any question about the functionality feel free to ask.

查看这里的新代码 http://jsbin.com/uxuTAba/5/ 。

这篇关于自定义jQuery子菜单定位的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！