Internet 관련 자료
HomePage Backward Forward Post Reply List
Delete Modify
  제목   [JavaScript] 메뉴 예제 1998/10/07 (13:13)
이름 김효원
번호 33
조회 344
본문 <HTML>
<HEAD>
       <TITLE>HowPC 자바스크립트 예제 01 - 메뉴</TITLE>

<!-- 첫번째 할일
    여기부터 "여기까지"라고 쓰여있는 부분을 실제로 메뉴가 사용될 HTML
    문서의 <HEAD> ... </HEAD> 사이에 복사한다. -->

<SCRIPT LANGUAGE="JavaScript">

<!--
if ((navigator.userAgent.substring(0,9) == "Mozilla/3") ||
   (navigator.userAgent.substring(0,9) == "Mozilla/4")) {
/* 다음의 두개의 문장에서 4 대신에 메뉴 항목 갯수를 적어준다. */
       standard = new MakeArray(4)
       over = new MakeArray(4)
/*
 다음에 나오는 문자열들에 각 메뉴에 해당하는 이미지들의 경로를 적어준다.
*/
       standard[1].src = "img/button_address.gif"
       standard[2].src = "img/button_cancel.gif"
       standard[3].src = "img/button_close.gif"
       standard[4].src = "img/button_new.gif"

       over[1].src = "img/button_address_reversed.gif"
       over[2].src = "img/button_cancel_reversed.gif"
       over[3].src = "img/button_close_reversed.gif"
       over[4].src = "img/button_new_reversed.gif"
}

function MakeArray(n) {
       this.length = n
       for (var i = 1; i<=n; i++) { this[i] = new Image() }
       return this
}

function msover(num) {
       if ((navigator.userAgent.substring(0,9) == "Mozilla/3") ||
           (navigator.userAgent.substring(0,9) == "Mozilla/4")) {
               if (over[num].src != "") {
/*
  다음 문장에서 -1 대신에 실제 <BODY> 부분에서 사용될 이미지 중에 이 메뉴에
  사용되는 첫번째 이미지보다 앞에 위치하는 이미지 갯수에서 1을 뺀 값을 쓰면 된다.
*/

                       document.images[num-1].src = over[num].src
               }
       }
}

function msout(num) {
       if ((navigator.userAgent.substring(0,9) == "Mozilla/3") ||
           (navigator.userAgent.substring(0,9) == "Mozilla/4")) {   
               if (standard[num].src != "") {
/*
  다음 문장에서 -1 대신에 실제 <BODY> 부분에서 사용될 이미지 중에 이 메뉴에
  사용되는 첫번째 이미지보다 앞에 위치하는 이미지 갯수에서 1을 뺀 값을 쓰면 된다.
*/
                       document.images[num-1].src = standard[num].src
               }
       }
}
// -->

</SCRIPT>
<!-- 여기까지 -->
</HEAD>

<BODY BGCOLOR="#FFFFFF">

<!-- 두번째로 할 일 -->
<!--
       <BODY>...</BODY> 사이에 다음과 같은 내용을 추가한다.
-->

<CENTER>
<!-- address.html 대신에 원하는 웹 문서의 이름이나 링크 URL을 써준다.
    button_address.gif 대신에 원하는 이미지 이름을 써준다. -->
<A HREF="address.html" TARGET="_self" OnMouseOver="msover(1) ; return false" OnMouseOut="msout(1)">
<IMG ALT="Address" border=0 width=60 height=60 SRC="img/button_address.gif"></A>

<A HREF="cancel.html" TARGET="_self" OnMouseOver="msover(2) ; return true" OnMouseOut="msout(2)">
<IMG ALT="Cancel" border=0 width=60 height=60 SRC="img/button_cancel.gif"></A>

<A HREF="close.html" TARGET="_self" OnMouseOver="msover(3) ; return true" OnMouseOut="msout(3)">
<IMG ALT="close" border=0 width=60 height=60 SRC="img/button_close.gif"></A>

<A HREF="new.html" TARGET="_self" OnMouseOver="msover(4) ; return true" OnMouseOut="msout(4)">
<IMG ALT="new" border=0 width=60 height=60 SRC="img/button_new.gif"></A>

</CENTER>
<!-- ------------------------------------------------------- -->
</BODY>
</HTML>
HomePage Backward Forward Post Reply List
1998 by swindler