상위로 이동
로그인
오마이사이트

지식나눔

마우스오버나 클릭시 테이블,줄,칸 노출설정

 
탭을 달아 마우스가 오버할때나 클릭할 때 서로 다른 내용을 보여줄 때 사용합니다.
  1. 먼저 각각의 테이블(혹은 줄,칸)에 ID 값을 주고 노출설정을 합니다.
    이해를 돕기위해 3개의 테이블을 노출시킨다고 가정하겠습니다. ( layer_notice , layer_news , layer_qna )

    id='layer_notice' style='display:block'         // 초기페이지 노출
    id='layer_news' style='display:none'          // 초기페이지 감춤
    id='layer_qna' style='display:none'            // 초기페이지 감춤
  2. 각 버튼에 버튼을 삽입합니다.

     
    onMouseOver="MM_showHideBoards('layer_notice','','block','layer_news','','none','layer_qna','','none');MM_swapImage('Img1','','images/layer_01_over.gif','Img2','','images/layer_02.gif', 'Img3','','images/layer_03.gif', 1)"
    onMouseOver="MM_showHideBoards('layer_notice','','none','layer_news','','block','layer_qna','','none');MM_swapImage('Img1','','images/layer_01.gif','Img2','','images/layer_02_over.gif', 'Img3','','images/layer_03.gif', 1)"
    onMouseOver="MM_showHideBoards('layer_notice','','none','layer_news','','none','layer_qna','','block');MM_swapImage('Img1','','images/layer_01.gif','Img2','','images/layer_02.gif', 'Img3','','images/layer_03_over.gif', 1)"

  3. 탭 이미지에 (마우스오버되는 이미지) 네임값을 입력합니다.
    name=Img1  name=Img2   name=Img3 
※ onClick 으로도 대체하여 사용가능합니다.
※ onClick="MM_showHideBoards('add_file_1','','block');"     // add_file_1 을 클릭시 오픈 
     id='add_file_1' style='display:none'                              // 테이블(줄,칸)에 ID 지정
 
 
공유하기
등록자

염상훈

등록일
2009-10-27 04:32
조회
18,634