JavaScript에서 이미지 스왑이 예상대로 작동하지 않습니다.

Question

크기가 큰 이미지와 작은 이미지가 두 개 있습니다. 큰 것은 77 X 15이고 작은 하나는 15 X 15입니다.

이제이 두 이미지는 크기가 다를 수있는 다른 이미지 위에 놓입니다. 일어날 것으로 예상되는 것은; 사용자가 작은 이미지를 가리키면 숨겨지고 큰 이미지가 표시됩니다. 두 이미지는 DIV에 래핑됩니다. 나는 내가이 일을 할 수 있다는 것을 알고있다. (나는 그것을 작동시킨다.)하지만 나는 그것을 인라인으로 유지해야한다. (내가 아는 범죄자). 지금까지 제가 가지고있는 코드는 다음과 같습니다. 이 코드를 전달했다는 것을 명심하십시오. 일어날 것으로 보인다 무엇

<div id="small" style="position:absolute;top:0px;right:15px; z-index:5000;" onmouseover="this.style.visibility='hidden';" onmouseout="this.style.visibility='visible';"> 

<img src="small.gif" style="FILTER:Alpha(Opacity=50, FinishOpacity=50, style=0); position:absolute; width: 15px; height: 15px;" border="0" alt="text"> 

</div> 

<div id="large" style="position:absolute;top:0px;right:77px; z-index:5000;" onmouseover="this.style.visibility='visible';" onmouseout="this.style.visibility='hidden';"><img src="large.gif" style="position:absolute" border="0" alt="text"> 

</div> 

내가 큰 이미지 위에 마우스를 올려 때 사라지고 그 작은 하나가 당신이 위로 마우스를 가져 가면 깜박이는 유지한다는 것이다. 어떤 아이디어?

편집 : 두 이미지가 다르다는 것을 잊어 버리면 한 이미지의 크기를 조정할 수 없습니다.

내가 완전히 잘못 될 수 있으므로 알려 주시기 바랍니다.

감사

Answer 1

내가 하나의 이미지와 하나의 DIV에 단순한 JQuery와 애니메이션을 사용하는 것이 좋습니다, 그것은 매우 하느님의 방법이라고 생각하지 말아. on mouseOver 높이를 늘리거나 mouseout에서 다시 줄입니다!