자바스크립트 hover animation 추가
본문
html
<img id="logo_img" src="<?php echo G5_IMG_URL; ?>/logo_ex1.png"
onmouseover="hover(this);" onmouseout="unhover(this);" />
javascript
function hover(element) {
element.setAttribute('src', '<?php echo G5_IMG_URL; ?>/logo_ex2.png');
}
function unhover(element) {
element.setAttribute('src', '<?php echo G5_IMG_URL; ?>/logo_ex1.png');
}
현재 코드는 이러합니다. hover시 이미지가 바뀌도록 했는데,
저는 추가적으로 fade in과 같은 부드러운 전환 효과를 주고싶습니다.
자바스크립트에 어떤 함수를 추가해야할까요??
답변 기다리겠습니다 :)
!-->!-->
답변 3
꼭 자바스크립트로만 하셔야 하는 이유가 있을까요..?
같은 div 에 이미지 2장넣고 hover시 바껴야할 이미지는 opacity:0 으로 해놓고
css로 호버했을때 서로 opacity 만 조절하면 될거같은데요..
답변을 작성하시기 전에 로그인 해주세요.