快速实现jQuery多级菜单效果

利用js或者jquery最快速实现导航条的多级菜单效果。

我这个代码用的是jquery1.9.1，ie8以下的兼容有待考虑，主要是代码的简介性，write less,do more.

  
  
    .top-nav
    {
      font-size: 12px;
      font-weight: bold;
      list-style: none;
    }
    .top-nav li
    {
      float: left;
      list-style: none;
      margin-right: 1px;
    }
    .top-nav li a
    {
      line-height: 20px;
      text-decoration: none;
      background: #DDDDDD;
      color: #666666;
      display: block;
      width: 80px;
      text-align: center;
    }
    .top-nav li a:hover
    {
      background: #900;
      color: #FFF;
    }
    .top-nav ul
    {
      list-style: none;
      display: none;
      width: 80px;
      padding: 0;
      position: relative;
    }
    .top-nav li ul li ul
    {
      position: absolute;
      top: 0;
      left: 80px;
    }
  


  

    
首页内容
      

 
前端课程 +
   

     
javascript
     
css
     
jquery
   
 
 
手机开发
   

     
ios开发
     
android开发
     
WP开发
   
 
 
后台编程
      
    
    
课程大厅 
    
学习中心 +
      

 
前端课程 +
   

     
javascript
     
css
     
jquery
   
 
 
手机开发
   

     
ios开发
     
android开发
     
WP开发
   
 
 
后台编程
      
    
    
关于我们
  
    

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。