728x90
반응형
1. 마우스오버 시 다른 이미지로 교체하기
<a href="#">
<img src="기본이미지" onmouseover="this.src='마우스오버이미지'" onmouseout="this.src='기본이미지'" border="0">
</a>
2. 마우스오버 시 버튼 누르는 효과 주기
.img:hover { position: relative; top: 2px; left: 2px; }
img라는 이름의 클래스를 가진 요소에 마우스를 올리면 버튼처럼 눌리는 효과가 나타난다.
top: 2px , left: 2px 은 각각 위, 왼쪽에서 2px만큼 이동하는 것이므로, 버튼이 눌리는 움직임을 크게 혹은 작게 하려면 2px의 값을 변경하면 된다.
728x90
반응형