<td>색 변경시키기..
<style type="text/css">
td.mouseOver {
background: #f7f7f7;
}
td.mouseOut {
background: #fff;
}
</style>CSS를 이렇게 선언해 주시고요. <td onMouseOver="this.className='mouseOver';" onMouseOut="this.className='mouseOut'">으로 하시면 됩니다. 인터넷 익스플로러에서는 이 방법밖에 없는 것 같고요. 파이어폭스(FireFox)에서는 setAttribute("class","myClass");를 사용할 수 있습니다. 스크립트에 this.onMouseOut="myMouseOutFunction();"을 추가해 주면 <td>에는 그냥 <td onMouseOver="myMouseOverFunction();">와 같이만 해주어도 나머지 마우스 아웃이 스크립트로 구현이 되기 때문에 소스가 아주 간단해 지지요!! 그러나 현실적으로는 IE 에서 지원이 안되기 때문에 사용 불가능 합니다. ㅜㅜ
재미 있는 것은요... 만약 색을 바꿔야 하는 <td>의 내용이 글씨 뿐이라면.. :hover 슈도엘리먼트(pseudo-element)를 쓸 수 있습니다.
ink, a:visited {
display: block;
background: #fff;
}
a:hover {
display: block;
background: #f7f7f7;
}
이렇게 하면 <td>를 사용하지 않고서도 <a>를 display: block으로 바꾸고 너비와 높이를 주면 CSS만(pure CSS)으로 스크립트를 쓴 것과 같은 효과를 줄 수 있습니다.
February 23, 2004 04:31 PM
![[Valid RSS]](/home/images/badge-valid-rss.png "Validate my RSS feed"){kind=icon}