묻고답하기
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
서브메뉴 제작이 잘 안되요!
2004.02.04 19:07
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>홈</title>
<meta name="generator" content="Namo WebEditor v6.0">
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}
function MM_showHideLayers() { //v3.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<table height="20">
<tr>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','show','layer2','','hide','layer3','','hide','layer4','','hide','layer5','','h
ide','layer6','','hide','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/main.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','show','layer3','','hide','layer4','','+ '+ 'hide','layer5','','h
ide','layer6','','hide','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/notice.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','hide','layer3','','show','layer4','','hide','layer5','','h
ide','layer6','','hide'+ ','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/guild.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','hide','layer3','','hide','layer4','','show','layer5','','h
ide','layer6','','hide'+ ','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/gameguide.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','+ 'hide','layer2','','hide','layer3','','+ 'hide','layer4','+ '','hide','layer5','','s
how','layer6','','hide','layer7','','hide','layer8',''+ ','hide'
)" style="cursor:hand"><img src = images/menu/community.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','hide','layer3','','hide','layer4','','hide','layer5','','h
ide','layer6','','show','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/pds.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','hide','layer3','','hide','layer4','','hide','layer5','','h
ide','layer6','','+ 'hide','layer7','','show','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/oekaki.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1',''+ ','hide','layer2','','hide','layer3','','hide','layer4'+ ','','hide','layer5',''+ ','h
ide','layer6','','hide','layer7','','hide','layer8','','show'
)" style="cursor:hand"><img src = images/menu/playzone.PNG>
</td>
</tr>
</table>
<br><br><br>
<div id="layer1" style="width:277; height:18px; position:absolute; left:10px; top:40px; z-index:3; visibility:hidden;">
클릭하시면 메인으로 이동합니다^ㅡ^
</div>
<div id="layer2" style="width:315; height:20px; position:absolute; left:66px; top:40px; z-index:1; visibility:hidden;">
잡게원정대 공지사항 / 마비노기 공지사항 /
</div>
<div id="layer3" style="width:454; height:19px; position:absolute; left:152px; top:40px; z-index:1; visibility:hidden;">
길드원 게시판 / 길드 가입 게시판 / 이전 길드원 생존 게시판 /
</div>
<div id="layer4" style="width:302; height:18px; position:absolute; left:214px; top:40px; z-index:1; visibility:hidden;">
정보 게시판 / 연구 게시판 / 작곡 게시판 /
</div>
<div id="layer5" style="width:385; height:18px; position:absolute; left:338px; top:40px; z-index:1; visibility:hidden;">
자유 게시판 / 약속 게시판 / 소설 게시판 / 보물 창고 /
</div>
<div id="layer6" style="width:222; height:18px; position:absolute; left:451px; top:42px; z-index:1; visibility:hidden;">
스크린샷 자료실 / 포토 앨범 /
</div>
<div id="layer7" style="width:194; height:21px; position:absolute; left:522px; top:42px; z-index:1; visibility:hidden;">
오에카키 게시판으로 이동!
</div>
<div id="layer8" style="width:235; height:20px; position:absolute; left:489px; top:42px; z-index:1; visibility:hidden;">
플레이존은 준비중입니다!^ㅡ^
</div>
</body>
</html>
소스는 이렇게 했는데요;;
스크립트 오류가 나네요;
<head>
<meta http-equiv="content-type" content="text/html; charset=euc-kr">
<title>홈</title>
<meta name="generator" content="Namo WebEditor v6.0">
<script language="JavaScript">
<!--
function MM_findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && document.getElementById) x=document.getElementById(n); return x;
}
function MM_showHideLayers() { //v3.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
</head>
<body bgcolor="white" text="black" link="blue" vlink="purple" alink="red">
<table height="20">
<tr>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','show','layer2','','hide','layer3','','hide','layer4','','hide','layer5','','h
ide','layer6','','hide','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/main.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','show','layer3','','hide','layer4','','+ '+ 'hide','layer5','','h
ide','layer6','','hide','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/notice.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','hide','layer3','','show','layer4','','hide','layer5','','h
ide','layer6','','hide'+ ','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/guild.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','hide','layer3','','hide','layer4','','show','layer5','','h
ide','layer6','','hide'+ ','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/gameguide.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','+ 'hide','layer2','','hide','layer3','','+ 'hide','layer4','+ '','hide','layer5','','s
how','layer6','','hide','layer7','','hide','layer8',''+ ','hide'
)" style="cursor:hand"><img src = images/menu/community.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','hide','layer3','','hide','layer4','','hide','layer5','','h
ide','layer6','','show','layer7','','hide','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/pds.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1','','hide','layer2','','hide','layer3','','hide','layer4','','hide','layer5','','h
ide','layer6','','+ 'hide','layer7','','show','layer8','','hide'
)" style="cursor:hand"><img src = images/menu/oekaki.PNG>
</td>
<td height="22">
<span onMouseOver="MM_showHideLayers
('layer1',''+ ','hide','layer2','','hide','layer3','','hide','layer4'+ ','','hide','layer5',''+ ','h
ide','layer6','','hide','layer7','','hide','layer8','','show'
)" style="cursor:hand"><img src = images/menu/playzone.PNG>
</td>
</tr>
</table>
<br><br><br>
<div id="layer1" style="width:277; height:18px; position:absolute; left:10px; top:40px; z-index:3; visibility:hidden;">
클릭하시면 메인으로 이동합니다^ㅡ^
</div>
<div id="layer2" style="width:315; height:20px; position:absolute; left:66px; top:40px; z-index:1; visibility:hidden;">
잡게원정대 공지사항 / 마비노기 공지사항 /
</div>
<div id="layer3" style="width:454; height:19px; position:absolute; left:152px; top:40px; z-index:1; visibility:hidden;">
길드원 게시판 / 길드 가입 게시판 / 이전 길드원 생존 게시판 /
</div>
<div id="layer4" style="width:302; height:18px; position:absolute; left:214px; top:40px; z-index:1; visibility:hidden;">
정보 게시판 / 연구 게시판 / 작곡 게시판 /
</div>
<div id="layer5" style="width:385; height:18px; position:absolute; left:338px; top:40px; z-index:1; visibility:hidden;">
자유 게시판 / 약속 게시판 / 소설 게시판 / 보물 창고 /
</div>
<div id="layer6" style="width:222; height:18px; position:absolute; left:451px; top:42px; z-index:1; visibility:hidden;">
스크린샷 자료실 / 포토 앨범 /
</div>
<div id="layer7" style="width:194; height:21px; position:absolute; left:522px; top:42px; z-index:1; visibility:hidden;">
오에카키 게시판으로 이동!
</div>
<div id="layer8" style="width:235; height:20px; position:absolute; left:489px; top:42px; z-index:1; visibility:hidden;">
플레이존은 준비중입니다!^ㅡ^
</div>
</body>
</html>
소스는 이렇게 했는데요;;
스크립트 오류가 나네요;
z-index의 숫자가 낮을 수록 윗쪽에 놓이게 됩니다.
(예를 들어, z-index:1 과 z-index:2인 box(element, 개체)가 동시에 보이는 상태라면 값이 1인 개체가 2인 개체 위에 나타납니다(겹치는 부분에서)
서브메뉴에 적용할때는 동시에 visible 시키지 않으니까 구현상 상관은 없지만 어쨌든 같은 값을 가지는 건 오류니까요.