jQuery实现的导航下拉菜单效果

本文实例讲述了jQuery实现的导航下拉菜单效果。分享给大家供大家参考，具体如下：

1.效果如图所示：

2.html代码：

 

   
首 页
   
衬 衫
    

      
短袖衬衫
      
长袖衬衫
      
无袖衬衫
    
  
  
卫 衣
    

      
开襟卫衣
      
套头卫衣
    
   
  
裤 子
    

      
休闲裤
      
卡其裤
      
牛仔裤
      
短裤
    
   
   
联系我们
 

3.jQuery代码:

//导航效果（兼容IE6）

$(function(){
  $("#navigation ul li:has(ul)").hover(function(){
   $(this).children("ul").stop(true,true).slideDown(400);
  },function(){
   $(this).children("ul").stop(true,true).slideUp("fast");
  });
})

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery扩展技巧总结》、《jQuery常用插件及用法总结》、《jQuery拖拽特效与技巧总结》、《jQuery表格(table)操作技巧汇总》、《jquery中Ajax用法总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。