묻고답하기

  2. Support
  3. 묻고답하기

자바 계단형 메뉴 질문입니다...

2003.09.11 11:42

장수만세

밑에 소스는 여기 엔지오 강좌 게시판에 있는것을 조금 고친건데요...

메뉴에 마우스를 올리면 하위 메뉴가 나오는데 마우스를 밖으로 빼도 하위 메뉴가 계속 그대로 있어서 문제입니다...

마우스를 빼면 하위메뉴가 안나오도록 고쳐서 주시면 정말 감사하겠습니다...
자바스크립트를 전혀 몰라서여...;;;

부탁드립니다...


--------------------------------------------------------------------------------------------------


<head>
<title>Menu Test</title>
<style type="text/css">
a { font-size:10pt; font-family:tahoma; color: navy; text-decoration: none }
a:hover { color: red; font-family:tahoma; text-decoration: underline }
a.plain:hover { font-size:10pt; font-family:tahoma; color: blue; text-decoration: underline }
#box {
position:absolute;
visibility:hidden;
layer-background-color:silver }
#limebox {background-color:#eeeeee }
#bluebox {background-color:#eeeeee }
#mnubar {font:10pt; arial; font-weight:normal }
</style>

<script language="JavaScript">

ns=window.navigator.appName == "Netscape"
ie=window.navigator.appName == "Microsoft Internet Explorer"

function openIt(x) {

<!--♣넷스케이프의경우-->
if(ns) {
showbox= document.layers[x+1]
showbox.visibility = "show";
showbox.left=90;

var items = 5 ; // 메뉴의 갯수
for (i=1; i<=items; i++) {
elopen=document.layers[i]
if (i != (x + 1)) {
elopen.visibility = "hide" }
}
}


<!--♣익스플로러의 경우-->
if(ie) {
curEl = event.toElement
curEl.style.background = "#eeeeee" // 마우스 오버시 배경색

showBox = document.all.box[x];
showBox.style.visibility = "visible";
showBox.style.left = 90; // 서브메뉴의 왼쪽여백

var items = 5 // 메뉴의 갯수
for (i=0; i<items; i++) {
elOpen=document.all.box[i]
barEl=document.all.mnubar[i]
if (i != x){
elOpen.style.visibility = "hidden"
barEl.style.background = "white" // 비활성메뉴 배경색
}
}
}
}

function closeIt() {
var items = 5 // 메뉴의 갯수
for (i=0; i<items; i++) {
if(ie){
document.all.box[i].style.visibility = "hidden"
barEl=document.all.mnubar[i]
barEl.style.background = "white"
}
if(ns){ document.layers[i+1].visibility = "hide"}
}
}

</script>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr"></head>


<body>
<table width="100" border="0" cellspacing="0" cellpadding="6">
  <tr>
    <td> </td>
    <td> <a href="#" onmouseover="openIt(0)" id=mnubar>Menu 1</a><br></td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> <a href="#" onmouseover="openIt(1)" id=mnubar>Menu 2</a><br></td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> <a href="#" onmouseover="openIt(2)" id=mnubar>Menu 3</a><br></td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> <a href="#" onmouseover="openIt(3)" id=mnubar>Menu 4</a><br></td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> <a href="#" onmouseover="openIt(4)" id=mnubar>Menu 5</a><br></td>
    <td> </td>
  </tr>
</table>
<br>


<!-- ♣서브메뉴 1 -->

<div id=box style=top:25>
  <table width="100" border="0" cellspacing="0" cellpadding="0" id=bluebox>
    <tr>
      <td><a href='#'>SUB-1-1</a></td>
    </tr>
    <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
  </table>
</div>


<!-- ♣서브메뉴 2 -->

<div id=box style=top:55>
<table width="100" border="0" cellspacing="0" cellpadding="0" id=bluebox>
    <tr>
      <td><a href='#'>SUB-1-1</a></td>
    </tr>
    <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
  </table>
</div>

<!-- ♣서브메뉴 3 -->

<div id=box style=top:85>
<table width="100" border="0" cellspacing="0" cellpadding="0" id=bluebox>
    <tr>
      <td><a href='#'+ '+ '>SUB-1-1</a></td>
    </tr>
    <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
  </table>
</div>

<!-- ♣서브메뉴 4 -->

<div id=box style=top:115>
<table width="100" border="0" cellspacing="0" cellpadding="0" id=bluebox>
    <tr>
      <td><a href='#'>SUB-1-1</a></td>
    </tr>
    <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
  </table>
</div>

<!-- ♣서브메뉴 5 -->

<div id=box style=top:145>
<table width="100" border="0" cellspacing="0" cellpadding="0" id=bluebox>
    <tr>
      <td><a href='#'>SUB-1-1</a></td>
    </tr>
    <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
        <tr>
      <td><a href=#>SUB-1-2</a></td>
    </tr>
  </table>
</div>
</body>


이 게시물을
좋아요
목록
글쓴이 제목 최종 글
XE 공지 글 쓰기,삭제 운영방식 변경 공지 [16] 2019.03.05 by 남기남
nann 버튼클릭하면 없어졌다가 다시 클릭하면 나타나는 테이블을 어떻게 만드나요?(이미지참조) [3] 2007.08.10
yaho. :-D FLASH MX에서여.. [5] 2007.08.10
윤여준 웹 페이지 보안에 관한 질문이요!! [2] 2007.08.10
kuann 사진 업로드 폴더 속에 이러한 파일이 있는데 이 것이 무슨 내용인지요?  
hozz호찌 Offset 을 이용한 사진으로 배경 만들기.  
박형준 애매한 질문 한가지 [1] 2007.08.10
impre URL에서 변수로 넘길시... [3] 2007.08.10
쥬스트 그림에 마우스 갖다댔을때 다른그림이 롤오버되는.. [2] 2007.08.10
RCT 웹진닷컴 도와주세요...표 관련 ; [3] 2007.08.10
mayaa 이미지레디에서...  
mayaa 이미지레디에서...  
모깃불 크롬리스 윈도우에서 이미지맵 적용이 안되는건가요?  
느닷없이질문 1픽셀의 오차 [2] 2007.08.10
I＊LOVeSOONY 점선 어떻게 만들어야 쉽게 만들수 있을까요? [4] 2007.08.10
정우진 프리베넷 서버를 운영...하고싶습니다. [1] 2007.08.10
dizaina apm 설치 때문에.. [3] 2007.08.10
likemed 긴페이지에서 스크롤 내린 후 짧은 답글을 쓴 후,,,, [2] 2007.08.10
I＊LOVeSOONY [일러스트] 설정 유지법? [1] 2007.08.10
I＊LOVeSOONY [일러스트]문서에 있는 테두리는 무엇인가요? [1] 2007.08.10
AKI 헤더를 이용한 파일 다운로더는 어떻게''ㅅ''?  
코코링 ★나모웹에디터-폼필드질문입니다★  
장수만세 자바 계단형 메뉴 질문입니다...  
김민규 include 구문으로는 이미지파일을 출력할 수 없는건가요? [3] 2007.08.10
정말정말 하나의 메뉴클릭과 동시에 두곳의 프레임의 내용이 바뀌는것~ [1] 2007.08.10
풯두 제발좀 도와주세요 [1] 2007.08.10
꿀상 동영상 삽입시 재생부분만 나오게하고 싶습니다. [1] 2007.08.10
이재환 흑흑 아이프레임 자동조절하는게 잘 안되용... [4] 2007.08.10
이동원 이게 무슨 뜻이죠? [1] 2007.08.10
플로렐라 $REQUEST_URI 에서... [4] 2007.08.10
노준형 FTP로 화일 올릴때 0바이트 되어버리는 현상 [1] 2007.08.10
태그 쓰기