帮忙看看到底哪里出错了...._html/css_WEB-ITnose

做了一个小练习，想要每次鼠标滑过菜单项时，菜单项的背景色改变一下。为什么没变化呢....代码如下：

"http://HdhCmsTestw3.org/TR/xhtml1/Dtd/xhtml1-transitional.dtd">


练习




$(document).ready(function(){
function hbtn(btn)
{
$("#" + btn).css("background-color", "green");
}
function lbtn(btn)
{
$("#" + btn).css("background-color", "red");
}
$("#s1").hover(function(){hbtn("s1");}, function(){lbtn("s1");});
$("#s2").hover(function(){hbtn("s2");}, function(){lbtn("s2");});
$("#s3").hover(function(){hbtn("s3");}, function(){lbtn("s3");});
$("#s4").hover(function(){hbtn("s4");}, function(){lbtn("s4");});
$("#s5").hover(function(){hbtn("s5");}, function(){lbtn("s5");});
});



#table1{
margin-left:auto;
margin-right:auto;
font-family:黑体;
font-size:24px;
border-spacing:0px 0px;
}
#table1 td{
background-color:green;
background-size:contain;
text-align:center;
padding:12px;
cursor:pointer;
height:70px;
width:174px;
border:2px solid gray;
}







A
B
C
D
E

回复讨论(解决方案)

    练习     $(document).ready(function(){$(".s").bind("mouseover",function(){$(this).css("background","red");});$(".s").bind("mouseout",function(){$(this).css("background","green");});});  #table1{  margin-left:auto;  margin-right:auto;  font-family:黑体;  font-size:24px;  border-spacing:0px 0px;}#table1 td{  background-color:green;  background-size:contain;    text-align:center;   padding:12px;  cursor:pointer;  height:70px;  width:174px;  border:2px solid gray;}      A  B  C  D   E      

LS是简单点的写法
你主要错在两处
1.引用的JS文件失效了，你可以访问一下看看。
换这个试试

2.lbtn里面应该是变绿吧？hbtn是变红，你里面给bg-color赋值的地方写反了。

可以写得简洁一点

    练习    	table{	  margin-left:auto;	  margin-right:auto;	  font-family:黑体;	  font-size:24px;	  border-spacing:0px 0px;	}	table td{	  background-color:green;	  background-size:contain;  	  text-align:center; 	  padding:12px;	  cursor:pointer;	  height:70px;	  width:174px;	  border:2px solid gray;	}	.bg{		background: red;	}   	 		 			 A 			 B 			 C 			 D  			 E 		 	 	 		$(document).ready(function(){		 	$('td').hover(function(){		 		$(this).addClass('bg');		 	},function(){		 		$(this).removeClass('bg');		 	})		})	     

查看更多关于帮忙看看到底哪里出错了...._html/css_WEB-ITnose的详细内容...