Ô đổi màu khi rê chuột

[JavaScriptBank]

Hiệu ứng làm cho một ô sẽ đổi màu nền khi bạn rê chuột đến.... chi tiết ([Only registered and activated users can see links])


[Only registered and activated users can see links] ([Only registered and activated users can see links])
Demo: Ô đổi màu khi rê chuột ([Only registered and activated users can see links])

Cách cài đặt

Bước 1: Dùng mã CSS bên dưới cho việc định dạng hiệu ứng
CSS

<STYLE>TD {
POSITION: relative
}
</STYLE>
<!--
This script downloaded from [Only registered and activated users can see links]
Come to view and download over 2000+ free javascript at [Only registered and activated users can see links]
-->


Bước 2: Dùng mã JavaScript để cài đặt hiệu ứng
JavaScript

<SCRIPT language=JavaScript>
// This is a cross-browser (IE5.5 & NN4.7) cell background changer

var oncell = "c0"
function chgColor(celno)
{
var chgcell
if (document.layers) { //browser is NN
for (var i = 1; i < 5; i++)
{
chgcell = "window.document.c" + i + ".bgColor='white'";
eval(chgcell);
}
chgcell = "window.document."+ celno + ".bgColor='orange'";
}
else // assume IE5
{for (var index =1; index < 5; index++)
{
clrIt = "document.getElementById('c"+ index +"').bgColor='white'";
eval(clrIt);
}
chgcell = "document.getElementById('"+ celno + "').bgColor='orange'";
}
eval(chgcell);

}

function overm(celno)
{ var chgcell
if (document.layers) { // browser is NN
chgcell = "window.document."+ celno + ".bgColor='yellow'";
}
else //assume IE
{
chgcell = "document.getElementById('"+ celno + "').bgColor='yellow'";
}
eval(chgcell);
}

function outm(celno)
{ var chgcell
if (document.layers) { // browser is NN
chgcell = "window.document."+ celno + ".bgColor='white'";
}
else //assume IE
{chgcell = "document.getElementById('"+ celno + "').bgColor='white'";
}
eval(chgcell);
}
</SCRIPT>
<!--
This script downloaded from [Only registered and activated users can see links]
Come to view and download over 2000+ free javascript at [Only registered and activated users can see links]
-->


Bước 3: Đặt mã HTML bên dưới vào phần BODY
HTML

<TABLE border=1>
<TBODY>
<TR>
<TD id=c1><A href="[Only registered and activated users can see links]" onclick="oncell = 'c1'; chgColor('c1');" onmouseout="if (oncell != 'c1') {outm('c1');}" onmouseover="if (oncell != 'c1') {overm('c1');}">cell 1</A></TD>
<TD id=c2><A
href="[Only registered and activated users can see links]"
onclick="oncell = 'c2'; chgColor('c2');"
onmouseout="if (oncell !='c2') {outm('c2');}"
onmouseover="if (oncell !='c2') {overm('c2');}">cell 2</A></TD>
<TD id=c3><A
href="[Only registered and activated users can see links]"
onclick="oncell = 'c3'; chgColor('c3');"
onmouseout="if (oncell !='c3') {outm('c3');}"
onmouseover="if (oncell !='c3') {overm('c3');}">cell 3</A></TD>

<TD id=c4><A
href="[Only registered and activated users can see links]"
onclick="oncell = 'c4'; chgColor('c4');"
onmouseout="if (oncell !='c4') {outm('c4');}"
onmouseover="if (oncell !='c4') {overm('c4');}">cell 4</A></TD></TR></TBODY></TABLE>
<!--
This script downloaded from [Only registered and activated users can see links]
Come to view and download over 2000+ free javascript at [Only registered and activated users can see links]
-->




Các hiệu ứng tương tự
- Chữ đổi màu khi rê chuột ([Only registered and activated users can see links])
- Chữ đổi màu khi nhập ([Only registered and activated users can see links])
- Liên kết đổi màu khi rê chuột ([Only registered and activated users can see links])
Bạn có thể xem thêm nhiều JavaScript khác về Biểu mẫu ([Only registered and activated users can see links]) và Bảng ([Only registered and activated users can see links])





Mã nguồn JavaScript ([Only registered and activated users can see links]) - Sách học JavaScript ([Only registered and activated users can see links]) - Hỏi đáp JavaScript ([Only registered and activated users can see links])