自定义jQuery子菜单定位

自定义jQuery子菜单定位

本文介绍了自定义jQuery子菜单定位的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

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>

更新:

推荐答案

你最后我有一个答案你的问题。使用菜单的一些属性,如模糊和焦点。我发现此页面已包含解决方案。我研究那些行,并在你的代码中应用它。

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.

查看这里的新代码。

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

08-22 23:29