导航子菜单

Question

我想问如何使用 jQuery 来做这个子菜单？

例如我的菜单代码

<div class="menu">
<ul class="nav nav-pills">
<li class="divider"><a href="#">Our Company</a></li>
<li class="divider"><a href="#">Products</a></li>
<li class="divider"><a href="#">Contact Us</a></li>
<li><a href="#"><span class="glyphicon glyphicon-home"></span></a></li>
</ul>
</div>

和我的子菜单代码：

 <div class="submenu">
   <ul class="nav nav-pills">
    <li class="divider-point"><a href="#">ATC</a></li>
    <li class="divider-point"><a href="#">Radars</a></li>
    <li class="divider-point"><a href="#"> Components </a></li>
   </ul>
   </div>

最终结果应该是这样的：

http://media.smashingmagazine.com/wp-content/uploads/images/60-more-css-techniques/117.jpg

Answer 1

function subMenu(show) {
    if (show){
      document.getElementById('sub_menu').style.display = 'block';
    } else {
      document.getElementById('sub_menu').style.display = 'none';
    }
}