使用JQuery中hover()方法，使其根据鼠标的移动简单的改变背景颜色;

hover();用于模拟鼠标指针悬停事件，当鼠标指针移动到元素上时，会触发指定的第一个函数，当鼠标指针移除这个元素时，会触发第二个函数；类似于mouseover和mouseout组合具体的代码如下：

html代码：

    
    	
     
        	
      
首页
 
      
身边导航
 
      
美食
 
      
电影
 
      
KTV
 
      
酒店
 
      
购物
 
     
 
    
 css：

.nav{		margin:0;		padding:0px;		width:800px;		height:100px;}	.nav ul{ list-style:none; } a{ text-decoration:none;} .nav ul li{ width:100px; height:50px; line-height:50px; background-color:#999; display:inline; float:left; text-align:center; font-size:18px; font-weight:bold; }

Jq:

$(function(){			/*			导航背景颜色切换效果 hover()			*/			$("li").hover(function(){				$(this).css("background-color","#C60"); }, function(){ $(this).css("background-color","#999"); });

});