子菜单pathe.nl

Question

我正在使用Wordpress，我想为我的用户创建一个很好的子菜单。我正在浏览网页，偶然发现了一个很好的子菜单：www.pathe.nl

我如何用jQuery创建这样的菜单，或者有没有现有的Wordpress插件可以做到这一点？

任何帮助都将不胜感激。

我的菜单样式：

<div class="menu-main-nav-container">
   <ul id="menu-main-nav" class="menu">
      <li id="menu-item-51" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-51">
         <a href="/">Home</a>
       </li>
       <li id="menu-item-50" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-23 current_page_item menu-item-50">
           <a href="/locaties/">Locaties</a>
       </li>
       <li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49">
           <a href="/acties/">Acties</a>
           <ul class="sub-menu" style="display: block;">
              <li id="menu-item-79" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-79">
                 <a href="/tim/">tim</a>
              </li>
           </ul>
        </li>
        <li id="menu-item-48" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-48">
           <a href="/over/">Over</a>
        </li>
        <li id="menu-item-47" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-47">
            <a href="/contact/">Contact</a>
        </li>
        </ul>
</div>

这是我打电话时看到的菜单：

 <?php wp_nav_menu( array('menu' => 'Main Nav') ); ?>

Answer 1

我使用superfish jquery插件创建了一个类似于pathe.nl的菜单。你的菜单的标记和这个插件很配。它还支持嵌套菜单项。

我自己从来没有使用过Wordpress，但我认为实现这个插件是微不足道的。您需要添加到页面的唯一内容是

<script> 

    $(document).ready(function(){ 
        $("ul.sf-menu").superfish(); 
    }); 

</script>