Div 사용한 클릭시 테이블 숨기고 감추기

참고 글 : http://luvbaby.tistory.com/archive/20070301

<!-- 소스 Start -->

<div id="test_click1" style="display:block" align="center">

    <a href="#none"

         onclick="document.getElementById('test_more').style.display='block';

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

                     document.getElementById('test_click2').style.display='block'">보기  </a><br>

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

<div style="width:200px;height:200px;"><img src="http://cfs3.tistory.com/upload_control/download.blog?fhandle=YmxvZzQxMTk3QGZzMy50aXN0b3J5LmNvbTovYXR0YWNoLzAvODIuanBn" /></div>

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

</div>

<div id="test_click2" style="display:none" align="center">

    <a href="#none"

         onclick="document.getElementById('test_more').style.display='none';

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

                      document.getElementById('test_click1').style.display='block'">닫기 </a>

</div>

<div id='test_more' style="display:none">

</div>

<!-- 소스 End -->

마우스의 클릭이 아닌 오버/아웃에 따른 설정은

Onclick 대신 OnMouseOver/OnMouseOut 으로 변경해주면 될것이다.