CSS로 롤오버 이미지 구현.

예전에는 롤오버 이미지를 구현하기 위해 스크립트를 이용하였다.

아주 보기 싫고 지저분하다.

CSS 그 얼마나 깔끔하고 위대한 것인가!!!

아래와 같은 소스를 이용하자.

CSS삽입 부분

#menu a img.menuon {

display: none;

}

#menu a img.menuoff {

display: inline;

}

#menu a:hover img.menuon {

display: inline;

}

#menu a:hover img.menuoff {

display: none;

본문 적용 부분

<img src="일반 이미지" class="menuoff">
<img src="롤오버 이미지 주소" class="menuon">