묻고답하기
서브메뉴사라지지않게하려면?
2004.05.21 15:09
1)회사소개 - 메인메뉴
2)인사말/납품실적/회사약도 - 서브메뉴
이렇게 했습니다.
메인메뉴(회사소개)에 마우스를 올려놓으면 서브메뉴가 사라지않고
서브메뉴(인사말/납품실적/회사약도 )로 마우스를 옮길경우 서브메뉴의
사이트로 들어가게하는방법을 알고싶습니다.
초보자입니다.
어려우시더라도 자세한설명을 부탁드립니다.(관련된 사이트를 알려주셔도좋습니다.)
2)인사말/납품실적/회사약도 - 서브메뉴
이렇게 했습니다.
메인메뉴(회사소개)에 마우스를 올려놓으면 서브메뉴가 사라지않고
서브메뉴(인사말/납품실적/회사약도 )로 마우스를 옮길경우 서브메뉴의
사이트로 들어가게하는방법을 알고싶습니다.
초보자입니다.
어려우시더라도 자세한설명을 부탁드립니다.(관련된 사이트를 알려주셔도좋습니다.)
1. 아래의 소스를 <HEAD>와 </head>사이에 넣습니다.
<style>
A:link
{
COLOR: FFFFFF;
FONT-FAMILY: "굴림";
FONT-SIZE: 12px;
TEXT-DECORATION: none
}
A:visited
{
COLOR: FFFFFF;
FONT-FAMILY: "굴림";
FONT-SIZE: 12px;
TEXT-DECORATION: none
}
A:hover
{
COLOR: FFFFFF;
FONT-FAMILY: "굴림";
FONT-SIZE: 12px;
TEXT-DECORATION: underline
}
TD
{
COLOR: FFFFFF;
FONT-FAMILY: 굴림;
FONT-SIZE: 12px;
FONT-WEIGHT: normal
}
TR
{
COLOR: FFFFFF;
FONT-FAMILY: 굴림;
FONT-SIZE: 12px
}
</style>
2. <body>태그 안에 [leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"]를 아래처럼 넣습니다.
<BODY leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
3. 아래의 소스를 <body>와 </body>사이에 넣습니다.
<TABLE width="100%" border="0" cellspacing="0" cellpadding="0">
<!-- Top 메뉴 -->
<TR>
<TD colspan="3" width="100%" align="left" valign="top">
<!--include top menu-->
<p>
<p>
<p>
<p>
<p><TABLE width="100%" border="0" cellspacing="0" cellpadding="0">
<script language="javascript">
<!--
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; }
}
function MM_findObj(n, d) { //v3.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); return x;
}
//-->
</script>
<TR bgcolor="C70900">
<TD height="22">
<table width="100%" border="1" cellspacing="0" cellpadding="0" height="22">
<tr>
<!--
<td width="49" bgcolor="000000" align="center"> <a href="주메뉴 클릭시 이동할 하이퍼 링크 주소" onMouseOver(layer1에 마우스 오버시 보여줄 레이어[show]와 감추어질 레이어[hide] 설정하기 )="MM_showHideLayers('Layer1','','hide','Layer2','','hide','Layer3','','hide','Layer4','','hide','Layer5','','hide','Layer6','','hide','Layer7','','hide')"><font color="#FFFFFF">강좌</a></font></td>
-->
<td bgcolor="000000" align="center" "> <font color="#FFFFFF"><a href="#" onMouseOver="MM_showHideLayers('Layer1','','hide','+ '+ 'Layer2','','hide','Layer3','','hide','Layer4','','hide','Layer5','','hide','Layer6','','hide','Layer7','','hide')">MENU 1</a></font></td>
<td bgcolor="000000" align="center"> <a href="#" onMouseOver="MM_showHideLayers('Layer1','','show','Layer2','','hide','Layer3','','hide','Layer4','','hide','Layer5','','hide','+ 'Layer6','','hide','Layer7','','hide')">MENU 2</a></td>
<td bgcolor="000000" align="center"><a href="#" onMouseOver="MM_showHideLayers('Layer1','','hide','Layer2','','show','Layer3','','hide','Layer4','','hide','Layer5','','hide','Layer6','','hide','Layer7','','hide')">MENU 3</a></td>
<td bgcolor="000000" align="center"><a href="#" onMouseOver="MM_showHideLayers('Layer1',''+ ','hide','Layer2','','hide','Layer3','','show','Layer4'+ ',''+ ','hide','Layer5','','hide','Layer6','','hide','Layer7'+ ','','hide')">MENU 4</a></td>
<td bgcolor="000000" align="center"> <a href="#" onMouseOver="MM_showHideLayers('Layer1','','hide','Layer2','','hide','Layer3','','+ 'hide','Layer4','','show','Layer5','','+ 'hide','Layer6','+ '','hide','Layer7','','hide')">MENU 5</a></td>
<td bgcolor="000000" align="center"> <a href="#" onMouseOver="MM_showHideLayers('Layer1','','hide','Layer2','','hide','Layer3','','hide','Layer4','','hide','Layer5','','show','Layer6','','hide','Layer7','','hide')">MENU 6</a></td>
<td bgcolor="000000" align="center"> <a href="#" onMouseOver="MM_showHideLayers('Layer1','','hide'+ ','Layer2','','hide','Layer3','','hide','Layer4','','hide','Layer5','','hide','Layer6','','show','Layer7','','hide')">MENU 7</a></td>
<td bgcolor="000000" align="center"> <a href="#" onMouseOver="MM_showHideLayers('+ 'Layer1','','hide','Layer2','','hide','Layer3','','hide','Layer4','','hide','Layer5','','hide','Layer6','','hide','Layer7','','show')">MENU 8</a></td>
</tr>
</table>
</TD>
<td></td>
<td></td>
<td></td>
<td></td>
</TR>
<TR>
<TD width="100%" height="22" bgcolor="9C9D9C">
<!-- Layer 1위치 설정하기(마우스 오버시 나타날 레이어) <div id="레이어명" style="width:레이어가로너비; height:레이어세로높이; position:absolute; left:Y축위치(왼쪽에서 떨어진 위치); top:Y축위치(위쪽에서 떨어진위치) z-index:1; visibility:hidden; overflow: visible"> -->
<div id="Layer1" style="width:800px; height:36px; position:absolute; left:20px; top:28px; z-index:1; visibility:hidden; overflow: visible">
<!-- <a href="하이퍼링크 주소" target="타겟지정">예전데이타</a> 아래의 링크 주소는 -->
| <a href="#">menu 2-1</a>
| <a href="#">menu 2-2</a>
| <a href="#">menu 2-3</a>
| <a href="#">menu 2-4</a>
| <a href="#">menu 2-5</a>
| <a href="#">menu 2-6</a>
| <a href="#">menu 2-7</a>
| <a href="#">menu 2-8</a>
| <a href="#">menu 2-9</a>
| <a href="#">menu 2-10</a>
| <a href="#" target="JAVA">menu 2-11</a>
|
</div>
<div id="Layer2" style="position:absolute; left:141px; top:28px; width:751px; height:20px; z-index:1; visibility: hidden; overflow: visible">
| <a href="#">menu 3-1</a>
| <a href="#">menu 3-2</a>
| <a href="#">menu 3-3</a>
| <a href="#">menu 3-4</a>
| <a href="#">menu 3-5</a>
| <a href="#">menu 3-6</a>
| <a href="#">menu 3-7</a>
|
</div>
<div id="Layer3" style="position:absolute; left:170px; top:28px; width:700px; height:20px; z-index:1; visibility: hidden; overflow: visible">
| <a href="#">menu 4-1</a>
| <a href="#">menu 4-2</a>
| <a href="#">menu 4-3</a>
| <a href="#">menu 4-4</a>
| <a href="#">menu 4-5</a>
|
</div>
<div id="Layer4" style="position:absolute; left:450px; top:28px; width:522px; height:20px; z-index:1; visibility: hidden; overflow: visible">
| <a href="#">menu 5-1</a>
| <a href="#">menu 5-2</a>
| <a href="#">menu 5-3</a>
|
</div>
<div id="Layer5" style="position:absolute; left:512px; top:28px; width:215px; height:20px; z-index:1; visibility: hidden; overflow: visible">
| <a href="#" target="_new">menu 6-1</a>
| <a href="#">menu 6-2</a>
|
</div>
<div id="Layer6" style="width:600px; height:20px; position:absolute; left:165px; top:28px; z-index:1; visibility:hidden; overflow: visible">
| <a href="#">menu 7-1</a>
| <a href="#">menu 7-2</a>
| <a href="#">menu 7-3</a>
| <a href="#">menu 7-4</a>
| <a href="#">menu 7-5</a>
| <a href="#">menu 7-6</a>
| <a href="#">menu 7-7</a>
|
</div>
<div id="Layer7" style="width:345px; height:36px; position:absolute; left:540px; top:28px; z-index:1; visibility:hidden; overflow: visible">
| <a href="#">menu 8-1</a>
| <a href="#">menu 8-2</a>
| <a href="#">menu 8-3</a>
|
| <a href="#">menu 8-4</a>
|
</div></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</TABLE> </TD>
</TR>
</table>