[color=brown]要使光标经过表格行时,行的背景颜色发生变化。可以使用:οnmοuseοver="this.styl=bgColor='#999999'",注意:所在行的单元格不能设置了背景颜色。光标离开时变回原来的背景颜色: οnmοuseοut="this.style=bgColor='#ffffff'"
注意 bgColor的"c"应大写,可以利用此方法给单元格加背景颜色。
代码如下:
<table width="600" border="0" cellpadding="5" cellspacing="1" bgcolor="#CCCCCC">
<tr bgcolor="#FFFFFF" οnmοuseοver="this.style=bgColor='#999999'" οnmοuseοut="this.style=bgColor='#FFFFFF'">
<td width="137"> </td>
<td width="440" > </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="57"> </td>
<td οnmοuseοver="this.style=bgColor='#CCCCCC'" οnmοuseοut="this.style=bgColor=''"> </td>
</tr>
</table>
[/color]
--------------------------------------------------------------------
下面介绍第二种方法,JS调用:
[color=red]<script language="JavaScript1.2">
function changeto(highlightcolor){
source=event.srcElement
if (source.tagName=="TR"||source.tagName=="TABLE")
return
while(source.tagName!="TD")
source=source.parentElement
if (source.style.backgroundColor!=highlightcolor&&source.id!="ignore")
source.style.backgroundColor=highlightcolor
}
function changeback(originalcolor){
if (event.fromElement.contains(event.toElement)||source.contains(event.toElement)||source.id=="ignore")
return
if (event.toElement!=source)
source.style.backgroundColor=originalcolor
}
</script>
<!--以下是你代码是用来触发事件的,也是改变颜色的地方-->
<table border="1" width="54%">
<tr onMouseover="changeto('#fff362')" onMouseout="changeback('white')">
<td width="100%"> </td>
</tr>
<tr onMouseover="changeto('#ff5525')" onMouseout="changeback('white')">
<td width="100%"> </td>
</tr>
<tr onMouseover="changeto('#ff2262')" onMouseout="changeback('white')">
<td width="100%"> </td>
</tr>
</table>[/color]
注意 bgColor的"c"应大写,可以利用此方法给单元格加背景颜色。
代码如下:
<table width="600" border="0" cellpadding="5" cellspacing="1" bgcolor="#CCCCCC">
<tr bgcolor="#FFFFFF" οnmοuseοver="this.style=bgColor='#999999'" οnmοuseοut="this.style=bgColor='#FFFFFF'">
<td width="137"> </td>
<td width="440" > </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="57"> </td>
<td οnmοuseοver="this.style=bgColor='#CCCCCC'" οnmοuseοut="this.style=bgColor=''"> </td>
</tr>
</table>
[/color]
--------------------------------------------------------------------
下面介绍第二种方法,JS调用:
[color=red]<script language="JavaScript1.2">
function changeto(highlightcolor){
source=event.srcElement
if (source.tagName=="TR"||source.tagName=="TABLE")
return
while(source.tagName!="TD")
source=source.parentElement
if (source.style.backgroundColor!=highlightcolor&&source.id!="ignore")
source.style.backgroundColor=highlightcolor
}
function changeback(originalcolor){
if (event.fromElement.contains(event.toElement)||source.contains(event.toElement)||source.id=="ignore")
return
if (event.toElement!=source)
source.style.backgroundColor=originalcolor
}
</script>
<!--以下是你代码是用来触发事件的,也是改变颜色的地方-->
<table border="1" width="54%">
<tr onMouseover="changeto('#fff362')" onMouseout="changeback('white')">
<td width="100%"> </td>
</tr>
<tr onMouseover="changeto('#ff5525')" onMouseout="changeback('white')">
<td width="100%"> </td>
</tr>
<tr onMouseover="changeto('#ff2262')" onMouseout="changeback('white')">
<td width="100%"> </td>
</tr>
</table>[/color]