마우스 오버시 DIV 레이어 감추기 / 보이기

마우스 오버시 DIV 레이어 감추기 / 보이기

<!-- 소스 Start -->

<a href=" style="margin-left:20px;width:100px;" 

Onmouseover="

document.getElementById('top1').style.display='block';

document.getElementById('top2').style.display='none';

document.getElementById('top3').style.display='none';

document.getElementById('top4').style.display='none';

document.getElementById('top5').style.display='none';

">

우동 </a> 

<a href=" style="margin-left:20px;width:100px;"

Onmouseover="

document.getElementById('top2').style.display='block';

document.getElementById('top1').style.display='none';

document.getElementById('top3').style.display='none';

document.getElementById('top4').style.display='none';

document.getElementById('top5').style.display='none';

">짜장 </a> 

<a href=" style="margin-left:20px;width:100px;"

Onmouseover="

document.getElementById('top3').style.display='block';

document.getElementById('top2').style.display='none';

document.getElementById('top1').style.display='none';

document.getElementById('top4').style.display='none';

document.getElementById('top5').style.display='none';

">짬뽕 </a> 

<br>

<!-- 보기에 대한 내용 Start-->

<div id="top1" style="display:none;width:200px;height:200px;">

<img src="http://cfs3.tistory.com/upload_control/download.blog?fhandle=YmxvZzQxMTk3QGZzMy50aXN0b3J5LmNvbTovYXR0YWNoLzAvODIuanBn" />

</div>

<div id="top2" style="display:none;width:200px;height:200px;">

<img src="http://l.yimg.com/go/news/picture/2010/g7/20100702/20100702083129394g7_083651_0.jpg?x=80&sig=KdrNWVmtst7G5t3DIMskeA--" />

</div>

<div id="top3" style="display:none;width:200px;height:200px;">

<img src="http://l.yimg.com/go/news/picture/2010/h1/20100702/20100702090308690h1_092652_0.jpg?y=60&sig=JBMg3GwqS0dOqgyIlnqejw--" />

</div>

<div id="top4" style="display:none;width:200px;height:200px;">

<img src="http://l.yimg.com/go/news/picture/2010/h1/20100702/20100702032502275h1_032652_0.jpg?x=80&sig=dt8i6TSHVaqH3_yQ6T7fkw--" />

</div>

<div id="top5" style="display:none;width:200px;height:200px;">

<img src="http://l.yimg.com/go/news/picture/2010/b6/20100701/20100701153555488b6_154201_0.jpg?y=60&sig=B1hMrvQ3dS4bzN0qSfsKlg--" />

</div>

<!-- 보기에 대한 내용 End-->

</div>