jQuery实现水平菜单和垂直菜单

页面中添加垂直菜单标签：

<ul>
   <li class="main">
    <a href="#">菜单一</a>
    <ul>
     <li><a href="#">子菜一</a></li>
     <li><a href="#">子菜二</a></li>
    </ul>
   </li>
<ul>

添加水平菜单：

<ul>
   <li class="dmain">
    <a href="#">菜单一</a>
    <ul>
     <li><a href="#">子菜一</a></li>
     <li><a href="#">子菜二</a></li>
    </ul>
   </li>
<ul>

在js文件中添加事件：

$(document).ready(function(){
 $(".main>a").click(function(){
  $(this).parent().siblings().find("ul").slideUp(300);
  $(this).next().slideToggle(300);
 })
 $(".dmain").hover(function(){
  $(this).find("ul").slideDown(300);
 },function(){
  $(this).find("ul").slideUp(300);
 })
})