onMouseOver,onMouseOut,onClick三者要实现的一个效果 20

代码是这样的另外我还想实现个功能就是ONCLICK点击后滑动到其他表当前点击的这个颜色是不没的类似图片上的效果麻烦各位高人指点一下最好是帮我修改一下代码谢谢了<html>... 代码是这样的另外我还想实现个功能就是 ONCLICK 点击后滑动到其他表当前点击的这个颜色是不没的类似图片上的效果麻烦各位高人指点一下最好是帮我修改一下代码谢谢了
<html>
<head>
<title> 我的一个JS问题 </title>
<style type="text/css">
.on{background:#ff0000;}
.off{background:#cccccc;}
</style>

<script language="javascript">
var flag;
function on_over(btnName,myNum){
for(i=1;i <5;i++){
document.getElementById(btnName+i).className="off";
flag=0;
}
document.getElementById(btnName+myNum).className="on";
}
function on_out(btnName,myNum){
if(flag==0)
{
document.getElementById(btnName+myNum).className="off";
}
}
function on_click(btnName,myNum){

for(i=1;i <5;i++){
document.getElementById(btnName+i).className="off";
}
document.getElementById(btnName+myNum).className="on";
flag=1;

}
</script>
</head>

<body>
<table border=1 align=center>
<tr> <td width=50 id="tab_1" class="on" onMouseOver="on_over('tab_',1);" onMouseOut="on_out('tab_',1);" onClick="on_click('tab_',1);"> 1 </td> </tr>
</table>
<br> <br>

<table border=1 align=center>
<tr> <td width=50 id="tab_2" class="off" onMouseOver="on_over('tab_',2);" onMouseOut="on_out('tab_',2);" onClick="on_click('tab_',2);"> 2 </td> </tr>
</table>
<br> <br>

<table border=1 align=center>
<tr> <td width=50 id="tab_3" class="off" onMouseOver="on_over('tab_',3);" onMouseOut="on_out('tab_',3);" onClick="on_click('tab_',3);"> 3 </td> </tr>
</table>
<br> <br>

<table border=1 align=center>
<tr> <td width=50 id="tab_4" class="off" onMouseOver="on_over('tab_',4);" onMouseOut="on_out('tab_',4);" onClick="on_click('tab_',4);"> 4 </td> </tr>
</table>

</body>
</html> 展开

 我来答

3个回答

#热议# 应届生在签三方时要注意什么？

百度网友dfc2c6d
2011-11-24

知道答主

回答量：36

采纳率：0%

帮助的人：14.2万

我也去答题访问个人页

关注

展开全部

<html>   
<head>   
<title> 我的一个JS问题 </title>   
<style type="text/css">   
.on{background:#ff0000;}   
.off{background:#cccccc;}   
</style>   

<script language="javascript">   
var flag;
var selected;
function on_over(btnName,myNum){   
	for(i=1;i <5;i++){   
		document.getElementById(btnName+i).className="off";   
		flag=0;
	}   
	document.getElementById(btnName+myNum).className="on"; 
	document.getElementById(btnName+selected).className="on"; 	
	
}   
function on_out(btnName,myNum){   
	if(flag==0){
		document.getElementById(btnName+myNum).className="off";   
	}
	document.getElementById(btnName+selected).className="on"; 	
}   
function on_click(btnName,myNum){   
	for(i=1;i <5;i++){   
		document.getElementById(btnName+i).className="off";  
	}   
	document.getElementById(btnName+myNum).className="on";
	selected=myNum;
	flag=1;
}   
</script>   
</head>   

<body>   
<table border=1 align=center>   
<tr> <td width=50 id="tab_1" class="on" onMouseOver="on_over('tab_',1);" onMouseOut="on_out('tab_',1);" onClick="on_click('tab_',1);"> 1 </td> </tr>   
</table>   
<br> <br>   

<table border=1 align=center>   
<tr> <td width=50 id="tab_2" class="off" onMouseOver="on_over('tab_',2);" onMouseOut="on_out('tab_',2);" onClick="on_click('tab_',2);"> 2 </td> </tr>   
</table>   
<br> <br>   

<table border=1 align=center>   
<tr> <td width=50 id="tab_3" class="off" onMouseOver="on_over('tab_',3);" onMouseOut="on_out('tab_',3);" onClick="on_click('tab_',3);"> 3 </td> </tr>   
</table>   
<br> <br>   

<table border=1 align=center>   
<tr> <td width=50 id="tab_4" class="off" onMouseOver="on_over('tab_',4);" onMouseOut="on_out('tab_',4);" onClick="on_click('tab_',4);"> 4 </td> </tr>   
</table>   

</body>   
</html>


本回答被网友采纳






已赞过已踩过<

你对这个回答的评价是？
评论收起

慎重还可靠灬宝贝f
推荐于2016-04-05 · TA获得超过12.9万个赞

知道大有可为答主

回答量：1.9万

采纳率：52%

帮助的人：2648万

我也去答题访问个人页

关注

展开全部

　　onmouseover 属性在鼠标指针移动到元素上时触发。
　　注释：onmouseover 属性不适用以下元素：<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。

　　onmouseout 事件会在鼠标指针移出指定的对象时发生。

　　onclick 事件会在对象被点击时发生。
　　请注意， onclick 与 onmousedown 不同。单击事件是在同一元素上发生了鼠标按下事件之后又发生了鼠标放开事件时才发生的。

已赞过 已踩过<

评论收起

sunskite
2015-10-23 · TA获得超过2.3万个赞

知道大有可为答主

回答量：2.1万

采纳率：55%

帮助的人：1.2亿

我也去答题访问个人页

关注

展开全部

onMouseOver 在鼠标飘动着目标上的时候
onMouseOut 当鼠标移开的时候
onClick 当鼠标点击的时候

已赞过 已踩过<

评论收起

更多回答（1）

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

onMouseOver,onMouseOut,onClick三者要实现的一个效果 20

其他类似问题

为你推荐：