메뉴 건너뛰기

검색창 닫기

tnt_lang

html/script 여러가지의 색으로 롤오버 효과및 항목을 선택시 선택된 색을 고정시키는 예제

박상현 2003.11.07 10:13 조회 수 : 2193 추천:25

<SCRIPT language=JavaScript>

table_color=new Array();
table_stats=new Array();

table_color[1]='#cccccc';
table_color[2]='#ffaaaa';
table_color[3]='#aaaaff';

table_stats[1]=0;
table_stats[2]=0;
table_stats[3]=0;

var table_out_color='';
//이전 색으로 돌림

var temp=0;

// 마우스 오버시...
function m_over(table_obj,table_no)
{
  table_obj.style.backgroundColor=table_color[table_no];
}

// 마우스 아웃시
function m_out(table_obj,table_no)
{
if (!table_stats[table_no])
    table_obj.style.backgroundColor=table_out_color;
    // 클릭 되어있는지 검사...
}


// 테이블 클릭 / 언클릭 상태 저장
function clicked(table_no)
{
  temp=table_stats[table_no];
  temp=temp + (temp==0) - (temp==1);
  table_stats[table_no]=temp;
}

</SCRIPT>

BODY 안에 삽입할 부분-테이블형태 만들기
<BODY bgcolor='WHITE' text=BLACK link=#024888 vlink=#42637C alink=#3B9CEE>
<table border=0 width=100% cellspacing=1 cellpadding=3>
  <tr height=20>
        <td width=40 bgcolor=#9EB4D3><P align=center><font color=BLACK>
                번호</font></td>
  </tr>

  <tr height=20 bgcolor=white onMouseOver="m_over(this,1)" onMouseOut="m_out(this,1)"  OnClick="clicked(1)"; >
        <td width=40><p align=right>1 </td>
  </tr>

  <tr height=20 bgcolor=white onMouseOver="m_over(this,2)" onMouseOut="m_out(this,2)"  OnClick="clicked(2)"; >
        <td width=40><p align=right>2 </td>
  </tr>

  <tr height=20 bgcolor=white onMouseOver="m_over(this,3)" onMouseOut="m_out(this,3)"  OnClick="clicked(3)"; >
        <td width=40><p align=right>3 </td>
  </tr>

</table>
이 게시물을
이 글의 추천인 목록 수정 삭제 목록
쓰기 태그
위로