Jquery实现下拉菜单案例

本文实例为大家分享了Jquery实现下拉菜单的具体代码，供大家参考，具体内容如下

需要实现的结构如下图：

关于布局：

布局采用ul里面包含4个li，li里面包含a标签（微博）以及ul（下面的下拉菜单），采用hover改变移动到下拉菜单后背景变色。

关于功能：

首先利用jquery获取元素，然后给li添加mouseenter方法显示下面的下拉菜单，然后给li添加mouseleave方法离开后又隐藏下拉菜单。

最终代码如下：

 

    
    
    
    
    
    

 

    
    

        

            微博
            

                
私信
                
评论
                
@我
            
        
        

            微博
            

                
私信
                
评论
                
@我
            
        
        

            微博
            

                
私信
                
评论
                
@我
            
        
        

            微博
            

                
私信
                
评论
                
@我
            
        
    

 

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