ใครมีโคด เมื่อเมาซ์ชี้ตาราง แล้วตารางเปลี่ยนสีมั่งครับ

ฉันไม่มีตัวตน · 30 พฤษภาคม 2008, 21:49:44

ไปเจอโคดนี้มา มันยังไม่โดนใจน่ะครับ อยากได้แบบว่าเมาซ์ชี้แล้วเปลี่ยนสีทั้ง row เลย..ขอบคุณครับ

<html>
<head>
<title>เมาท์ชี้ที่ตารางแล้ว ตารางเปลี่ยนส</title>

<style type="text/css">
<!--
A:link { text-decoration: none}
A:active { text-decoration: none}
A:visited { text-decoration: none} 
A:hover {text-decoration: none; color: #00769D}
-->
</style>
<style>
.menulines{
border:1px solid #ffffff;
}

.menulines a{
text-decoration:none;
color:#00769D;
}
</style>

<script language="JavaScript1.2">
function borderize(what,color){
what.style.borderColor=color
}

function borderize_on(e){
if (document.all)
source3=event.srcElement
else if (document.getElementById)
source3=e.target
if (source3.className=="menulines"){
borderize(source3,"#ff3333")
}
else{
while(source3.tagName!="TABLE"){
source3=document.getElementById? source3.parentNode : source3.parentElement
if (source3.className=="menulines")
borderize(source3,"#ff3333")
}
}
}

function borderize_off(e){
if (document.all)
source4=event.srcElement
else if (document.getElementById)
source4=e.target
if (source4.className=="menulines")
borderize(source4,"white")
else{
while(source4.tagName!="TABLE"){
source4=document.getElementById? source4.parentNode : source4.parentElement
if (source4.className=="menulines")
borderize(source4,"white")
}
}
}

</script>
</head>

<body>


<table onMouseover="borderize_on(event)" onMouseout="borderize_off(event)" align=center width=100%>
<tr>
	<td class="menulines" width="16%"> <center>
        <a href="http://www.thaiwebcreator.com" target="_blank"><font face="MS Sans Serif" size="1">thaiwebcreator.com</font></a></center></td>
		<td>132456</td>
</tr>
<tr>
	<td class="menulines" width="16%"> 
      <p align="center"><a href="http://www.gazib.com" target="_blank"><font face="MS Sans Serif" size="1">GAZIB</font></a></p>
    </td>
</tr>
<tr>
	<td class="menulines" width="16%"> 
      <p align="center"><a href="http://www.nongkhaiweb.com" target="_blank"><font face="MS Sans Serif" size="1">NONGKHAIWEB</font></a></p>
    </td>
</tr>
<tr>
	<td class="menulines" width="16%"> 
      <p align="center"><a href="http://www.chaiyo.com" target="_blank"><font face="MS Sans Serif" size="1">CHAIYO</font></a></p>
    </td>
</tr>
<tr>
	<td class="menulines" width="16%"> 
      <p align="center"><a href="http://www.zarataweb.com" target="_blank"><font face="MS Sans Serif" size="1">ZARATAWEB</font></a></p>
    </td>
</tr>
<tr>
	<td class="menulines" width="16%"> 
      <p align="center"><a href="http://www.hotmail.com" target="_blank"><font face="MS Sans Serif" size="1">HOTMAIL</font></a></p>
    </td>
</tr>
</table>

</body>
</html>

tradeya · 30 พฤษภาคม 2008, 21:56:15

ลองไปเช็คที่

โค้ด เลือก

www.dynamicdrive.comดูก็ได้นะครับ เผื่อเจอสคริปอย่างที่อยากได้

naruphos

ถ้าเป้น Table นะครับ ตรง <tr> ให้ใส่แบบนี้ครับ

โค้ด เลือก

<tr onmouseover="javascript:this.bgColor='#E2E2E2'" onmouseout="javascript:this.bgColor='#FFFFFF'">

ลองดูนะครับ

UnzO

Javascript หนักไปนะผมว่า ใช้ CSS เลยครับง่ายมาก

โค้ด เลือก

tr:hover  {
	background-color: #CAF4FF;
}

น่าจะได้นะ

icez

tr ใช้ css: background color ไม่ได้ครับ
เคยทดลองมาแล้ว

ฉันไม่มีตัวตน

ขอบคุณทุกคนมากเลยครับเดี๋ยวจะลองดู

iNspIr@Tion

โค้ด เลือก

<td onmouseover="this.style.backgroundColor='#F4F4F4' " onmouseout="this.style.backgroundColor=' ' ">Test</td>

ฉันไม่มีตัวตน

อ้างถึงจาก: bucksu ใน 06 มิถุนายน 2008, 14:05:07
โค้ด เลือก ขยาย
<td onmouseover="this.style.backgroundColor='#F4F4F4' " onmouseout="this.style.backgroundColor=' ' ">Test</td>

แบบนี้เลยคร้าบบ ขอบคุณครับ โคดสั้นดี

ปล.แต่สคริปที่ผมโมอยู่ มันแก้ได้แล้วอ่ะ แต่จะหน่วงกว่าตัวนี้มาก เดี๋ยวลองเอาตัวนี้ไปใส่ดู

ฉันไม่มีตัวตน

อ้างถึงจาก: naruphos ใน 01 มิถุนายน 2008, 23:10:28
ถ้าเป้น Table นะครับ ตรง <tr> ให้ใส่แบบนี้ครับ

โค้ด เลือก ขยาย
<tr onmouseover="javascript:this.bgColor='#E2E2E2'" onmouseout="javascript:this.bgColor='#FFFFFF'">

ลองดูนะครับ

แบบนี้ก็ได้นี่นา ไม่ได้ลอง โทษทีครับ แหะๆ