사이트 내 전체검색
자바스크립트
마우스오버시 테이블 색 서서히 변화주기
로빈아빠
https://cmd.kr/javascript/124 URL이 복사되었습니다.
7,028 0 2009.10.18 01:05

본문

<head>와 </head>사이에 넣어주세요 
<script language="JavaScript">
<!--
var tInC=null;
var tIdC=null;
var tIdCOn = new Array(0,0,0,0);
var tIdCOff = new Array(1,1,1,1);

function tBgFIn(obj, col,idNum) {
if(tInC != obj && tInC != null && tIdCOn[idNum] == 0) tBgFOut(tInC,tIdC);       
if(tIdCOn[idNum] == 0) {
tIdCOn[idNum] = 1;
tIdCOff[idNum] = 0;
tInC=obj;
tIdC=idNum;
changeColor(obj, col);
}
}
function tBgFOut(obj,idNum) {
if(tIdCOff[idNum] == 0) {
tIdCOff[idNum] = 1;
tIdCOn[idNum] = 0;
changeColor(obj, "#ffffff");
}
}
function changeColor(obj, col) {
obj.filters.blendTrans.apply();
obj.style.backgroundColor= col;
obj.filters.blendTrans.play();
}

//-->

</script> 
<body>와 </body>사이에 넣어주세요 







<table width="400" height="50" cellpadding="0" cellspacing="1" border="0" bgcolor="#FF00CC">
<tr>
<td onMouseOver="tBgFIn(bgColorId0, 'pink',0)" onMouseOut="tBgFOut(tInC,tIdC)" id="bgColorId0" style="background-color: #ffffff; filter: blendTrans(duration=0.5);" width="200" height="50" align="center"> </td>
<td width="200" height="50" onMouseOver="tBgFIn(bgColorId1, '#ffffff',1)" onMouseOut="tBgFOut(tInC,tIdC)" id="bgColorId1" style="background-color: skyblue; filter: blendTrans(duration=0.5);" align="center"> </td>
<td width="200" height="50" onMouseOver="tBgFIn(bgColorId2, '#FCE0E0',2)" onMouseOut="tBgFOut(tInC,tIdC)" id="bgColorId2" style="background-color: #ffffff; filter: blendTrans(duration=0.5);" align="center"> </td>
<td width="200" height="50" onMouseOver="tBgFIn(bgColorId3, '#ffffff',3)" onMouseOut="tBgFOut(tInC,tIdC)" id="bgColorId3" style="background-color: #E2CBF9; filter: blendTrans(duration=0.5);" align="center"> </td>
</tr>
</table> 

onMouseOver="tBgFIn(bgColorId0, 'pink',0)" → 마우스를 올렸을 때 바뀔 색
background-color: #ffffff → 배경색
출처 : http://qdata.co.kr/bo/bbs/board.php?bo_table=jt&wr_id=67

댓글목록

등록된 댓글이 없습니다.

자바스크립트
831 (3/17P)

Search

Copyright © Cmd 명령어 3.147.52.33