묻고답하기

  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 남기남
LadiesKorea 게시판 이 부분 어떻게 바꾸죠? [2] file 2014.09.03 by SeungXE
lifeto Query ID값이 잘못 지정되었습니다.  
ojinger 게시판 제목 옆에 불러오기 버튼을 없애고 싶어요. [4] file 2014.09.03 by ojinger
애니즌 windows 8.1에서 XE 위지윅 에디터 입력문제 [11] 2014.09.03 by ForcePlane
처리낭군 '네이버 아이디로 로그인', '카카오계정으로 로그인' XE에 설치하려면 어떻게 해야 하나요? [1] file 2014.09.03 by 키스투엑스이
홈런볼11 첨부파일 다운 막기 [2] 2014.09.02 by XESniper
순박 메뉴가 추가가 안되요 삭제만되요  
루꼴라 댓글등록시 새로고침이 안돼요.도와주세요ㅠㅠ [1] 2014.09.02 by 루꼴라
lifeto 블로그형 모듈 ugletyle 설치. [1] 2014.09.02 by YJSoft
불패의초인 이거 파일은 어디에 쓰는건지 아시는분~ [3] 2014.09.02 by YJSoft
도메인8295 모바일에서 메일인증 기능 사용문제 [2] 2014.09.02 by 도메인8295
칼로리제로 테이블 사이의 간격을 없에고 싶어요~ [5] 2014.09.02 by DoorWeb
bbqzgo 모바일에서만 보이게하는 주석처리가있나요? [3] 2014.09.02 by DoorWeb
지룡자 게시판 제목에 말머리 나오게하고 싶습니다 [4] file 2014.09.02 by 몽실아빠
로양 웹진형 문서번호 [4] 2014.09.02 by 로양
게디노브드 제목이 강제 가운데 정렬됩니다 [9] file 2014.09.02 by 김기태155
이찌부 내용직접추가에서 위젯삽입시 안되나요? 안보이나요? [3] file 2014.09.02 by 비행청년ss123
순박 개초보 질문이요.. 메뉴가 추가가 안되요 [4] 2014.09.02 by 순박
CoffeeMix 게시판 설정을 하게되면 새로고침을 해야 바뀐설정으로 보이는 문제 file  
nanum 보이지 않는 문자 이용한 글 등록, 막을 수 있을까요?  
태그 쓰기