<HTML>
<HEAD>
<META http-equiv=Content-Type content="text/html; charset=ks_c_5601-1987">
<TITLE>overflow:hidden을 이용한 메뉴</TITLE>
<STYLE type=text/css>.mnu {
FONT-SIZE: 9pt; BACKGROUND: #424242; COLOR: white; FONT-FAMILY: verdana; TEXT-ALIGN: center
}
.subTD {
FONT-SIZE: 9pt; BACKGROUND: #e71018; CURSOR: default; COLOR: white; FONT-FAMILY: verdana; TEXT-ALIGN: center
}
#container {
BORDER-RIGHT: white 2px solid; BORDER-TOP: black 2px solid; BORDER-LEFT: black 2px solid; BORDER-BOTTOM: white 2px solid
}
</STYLE>
<SCRIPT language=javascript>
var menuText2=new Array("Menu1","Menu2","Menu3","Menu4","Menu5");
var menuText1=new Array("메뉴1","메뉴2","메뉴3","메뉴4","메뉴5");
var sub0=new Array("<a href=001.com>001</a>","002","003");
var sub1=new Array("004","005","006");
var sub2=new Array("007","008","009","010");
var sub3=new Array("011","012","013");
var sub4=new Array("014","015","016","017");
var menuW=100;
var menuH=20;
var subW=50;
var subH=20;
var containerW=menuW*menuText1.length;
var xLim=new Array(menuText1.length);
var xGap=menuW;
var menu2W=menuW*2;
var menu2H=menuH*2;
var x=0;
var z=0;
var yPos=-menuH;
var subCw=containerW-2;
function otherBack(idx){
for(i=0;i<menuText1.length;i++){
eval("mnu" + i + ".style.pixelTop=yPos");
for(j=0;j<eval("sub" + i + ".length");j++){
eval("subM" + i + ".style.pixelTop=menuH");
}
}
moveDIV(idx);
moveSUB(idx);
}
function moveDIV(idx){
if(eval("mnu" + idx +".style.pixelTop") < 0){
eval("mnu" + idx + ".style.pixelTop=mnu" + idx + ".style.pixelTop + 1");
timer1=setTimeout("moveDIV(" + idx + ")",10);
}else{
eval("mnu" + idx + ".style.pixelTop=0");
clearTimeout(timer1);
}
}
function moveSUB(idx){
if(eval("subM" + idx + ".style.pixelTop") > 0){
eval("subM" + idx + ".style.pixelTop=subM" + idx + ".style.pixelTop - 1");
timer2=setTimeout("moveSUB(" + idx + ")",10);
}else{
eval("subM" + idx + ".style.pixelTop=0");
clearTimeout(timer2);
}
}
</SCRIPT>
<META content="MSHTML 6.00.2800.1264" name=GENERATOR></HEAD>
<BODY>
<SCRIPT>
document.write("<div id='container' style='overflow:hidden;position:absolute;left:100;top:100;width:" + containerW + ";height:" + menuH + ";'>");
for(i=0;i<menuText1.length;i++){
xPos=xGap*x;
document.write("<div id='mnu"+ i +"' class=mnu style='cursor:default;position:absolute;left:"+ xPos + ";top:"+ yPos +";z-index:"+ z +";width:" + menuW+ ";height:"+ menu2H + ";'><span style='width:"+ menuW +";height:"+ menuH +";background:#E71018;color:white;'>"+ menuText1[i] +"</span><br><span onmouseover='otherBack("+ i +")' style='width:"+ menuW +";height:"+ menuH +";background:#424242;color:white;'>"+ menuText2[i] +"</span></div>");
x++;
z++;
}
document.write("</div>");
document.write("<div id='sub_container' style='position:absolute;left:100;top:118;width:"+ subCw + ";height:" + menuH + ";overflow:hidden;'>");
for(i=0;i<menuText1.length;i++){
document.write("<div id='subM"+ i +"' style='position:absolute;left:0;top:"+ menuH + ";width:100;"+ containerW + ";height:" + menuH +";'>");
document.write("<table width=" + subCw + " cellspacing=0 style='background:#424242'><tr>");
for(j=0;j<eval("sub" + i +".length");j++){
document.write("<td class='subTD'>"+ eval("sub" + i + "[j]") +"</td>");
}
document.write("</tr></table>");
document.write("</div>");
}
document.write("</div>");
</SCRIPT>
</SCRIPT>
</BODY></HTML>

비씨파크 주식회사, 대표이사 : 박병철 개인정보보호책임자 : 박병철
사업자등록번호 : 114-86-19888 |
본사 : 서울특별시 서초구 서초대로73길, 42, 1307호
전자우편 : master@bcpark.net |
(전화전 이용문의 게시판 필수)
전화: 02-534-982구(09:00~18:00) |
팩스: 02-535-155구 |
긴급: 010-9774-988삼
ㆍ저작권안내 : 비씨파크의 모든 컨텐츠(기사)는 저작권법에 보호를 받습니다. 단, 회원들이 작성한 게시물의 권리는 해당 저작권자에게 있습니다. 비씨파크에 게재된 게시물은 비씨파크의 입장과 다를 수 있습니다. 타인의 저작물을 무단으로 게시, 판매, 대여 또는 상업적 이용시 손해배상의 책임과 처벌을 받을 수 있으며, 이에 대해 책임을 지지 않습니다.
ㆍ쇼핑몰안내 : 비씨파크는 통신판매중개자로서 상품 주문, 배송 및 환불의 의무와 책임은 각 판매 업체에 있습니다.
Copyright ⓒ 2000-2026 BCPARK Inc. All Right Reserved.