부메뉴 나오게 하기 짜집기판...

333.jpg

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

<body bgcolor="#FFFFFF" text="#000000">

<SCRIPT type="text/javascript">
<!--
 old_debate='1';

 function showLayer_tap(objid){
  document.getElementById("debate_content"+old_debate).style.display="none";
  document.getElementById("debate_content"+objid).style.display="";
  old_debate=objid;
 }
//-->
</SCRIPT>


<table width="550" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td colspan="5" onMouseOver="javascript:showLayer_tap(0);"> </td>
  </tr>
  <tr>
    <td onMouseOver="javascript:showLayer_tap(0);" width="50"> </td>
    <td onMouseOver="javascript:showLayer_tap(1);">1번대메뉴</td>
    <td onMouseOver="javascript:showLayer_tap(2);">2번대메뉴</td>
    <td onMouseOver="javascript:showLayer_tap(3);">3번대메뉴</td>
    <td onMouseOver="javascript:showLayer_tap(0);" width="50"> </td>
  </tr>
  <tr>
    <td colspan="5" onMouseOver="javascript:showLayer_tap(0);" height="30"> </td>
  </tr>
</table>

<DIV id=debate_content0 style="DISPLAY: none;"></div>
<DIV id=debate_content1 style="DISPLAY: none;" style="position:absolute; top: 50px; width: 320px;height: 40px; margin-left: 10px; z-index:3;"><a href="주소">부메뉴1-1</a> / <a href="주소">부메뉴1-2</a> </div>
<DIV id=debate_content2 style="DISPLAY: none;" style="position:absolute; top: 50px; width: 320px;height: 40px; margin-left: 150px; z-index:3;"><a href="주소">부메뉴2-1</a> / <a href="주소">부메뉴2-2</a> </div>
<DIV id=debate_content3 style="DISPLAY: none;" style="position:absolute; top: 50px; width: 320px;height: 40px; margin-left: 280px; z-index:3;"><a href="주소">부메뉴3-1</a> / <a href="주소">부메뉴3-2</a> </div>
<!-- javascript:showLayer_tap(0);  ==> debate_content0 으로 이동해서 빈공간으로 나오게 만듬 -->

<!--top: 85px; width: 320px;height: 40px; margin-left: 280px; z-index:3;
   높이;div폭;div 높이;앞이랑 공간;
 -->

</body>
</html>

어디에서 본 소스인데 한번 비슷므리하게 만들어봐써요 ^^  혹시 필요한분들을 위해서.....



kbench 에

<html>
<head>
<title>temp37</title>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<SCRIPT language=JavaScript type=text/JavaScript>
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_findObj(n, d) { //v4.01
  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 && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

//상단문자 배너 스크롤
//-->
//  ------------------  개인화메뉴 시작 ------------------
var NS4;
var IE4;
var mouse_top;
var mouse_left;
var parent_menu_name = "class_userinfo";
var status_over = false; 
var event_id = "none";
var column_height = 18;
var mainmenu_top_indent = 0; 
var menuover_bgcolor = "#C9CDD1";
var menuover_fgcolor = "#ffffff";
var default_menuover_bgcolor = "#ffffff";
var default_menuover_fgcolor = "#000000";

NS4 = (document.layers);
IE4 = (document.all);
isWin = (navigator.appVersion.indexOf("Win") != -1)
if (NS4) {
  document.captureEvents(Event.CLICK)
  document.onclick = MouseDown;
}else if (IE4) {
  document.onclick = MouseDown;
}

function MouseDown(e) {
  event_target = event.srcElement;
  event_target = event_target.toString();
  event_check  = event_target.indexOf("javascript:UserMenuView(");  

  if (!status_over) hideAll();
  if (!event_check) {
    viewMenu(event, parent_menu_name);
  }else {
    hideAll();
  }
}

function hideAll() {
  eval(parent_menu_name + ".style.display = \"none\"");
  if (event_id == "none") { return; }
}

function viewMenu (e, ar_id) {
  if (ar_id == "none") return;
  menuLocBod = window.document.body;
  xPos = menuLocBod.scrollLeft + event.clientX;
  yPos = event.clientY + menuLocBod.scrollTop;
  screen_height = window.document.body.offsetHeight;
  screen_width = window.document.body.offsetWidth;
  mouse_top = e.y;
  mouse_left = e.x;
  eval("mainmenu_top_indent = " + parent_menu_name + ".children[0].children[0].children.length");
  mainmenu_top_indent = mainmenu_top_indent * column_height;

  if (screen_height > mouse_top + mainmenu_top_indent)
    yPos = event.clientY + menuLocBod.scrollTop;
  else
    yPos = (event.clientY + menuLocBod.scrollTop) - mainmenu_top_indent;

  if (mouse_top - mainmenu_top_indent < 0)
  yPos = event.clientY + menuLocBod.scrollTop;

  eval(ar_id + ".style.pixelTop =" + yPos);
  eval(ar_id + ".style.pixelLeft =" + xPos);  
  eval(ar_id + ".style.display = \"\"");
}

function onMouseOver(ar_obj, ar_id) {
  status_over = true;
  changeColor(ar_obj);
}

function onMouseOut(ar_obj) {
  status_over = false;
  changeColor(ar_obj);
}

//  ------------------  개인화메뉴 끝 ------------------
/*롤오버*/

function Roll(num,tog){eval("document.m"+num+".src=m"+num+"_"+tog+".src");} 

function pre_image_tig() {
for(a=1;a<=8;a++){
 eval('m'+a+'_on = new Image()');
 eval('m'+a+'_off = new Image()');
 eval('m'+a+'_on.src = \"http://images.kbench.com/n_img/newmenu/menu'+a+'_on.gif\"');
 eval('m'+a+'_off.src = \"http://images.kbench.com/n_img/newmenu/menu'+a+'_off.gif\"');
 }
}

function Show() { //v3.0
  var i,p,v,obj,args=Show.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 ChangeLayer(id)
{
    if (document.getElementById(id).style.display == "")
     document.getElementById(id).style.display = "none";
 else
  document.getElementById(id).style.display = "";
}

function ChangeLayerValue(id, value)
{
 document.getElementById(id).style.display = value;
}

pre_image_tig();
</SCRIPT>

<TABLE cellSpacing=0 cellPadding=0 border=0>
  <TR><TD><A onmouseover="Roll('1','on');Show('sub1','','show')" onfocus=this.blur() onmouseout="Roll('1','off');Show('sub1','','hide')"  href="#">
   <IMG height=37 src="http://images.kbench.com/n_img/newmenu/menu1_off.gif" width=79 border=0 name=m1></A></TD>
     <TD><IMG height=37 src="http://images.kbench.com/n_img/newmenu/frame_2.gif" width=7 border=0></TD>
     <TD><A onmouseover="Roll('2','on');Show('sub2','','show')"  onfocus=this.blur() onmouseout="Roll('2','off');Show('sub2','','hide')"  HREF="#">
    <IMG height=37 src="http://images.kbench.com/n_img/newmenu/menu2_off.gif" width=73 border=0 name=m2></A></TD>
  </TR></TBODY></TABLE>

<DIV id=sub1 onmouseover="Roll('1','on');Show('sub1','','show')" style="Z-INDEX: 200; VISIBILITY: hidden; POSITION: absolute" onmouseout="Roll('1','off');Show('sub1','','hide');">
<P style="MARGIN-LEFT: 10px">
<TABLE cellSpacing=0 cellPadding=0 border=0>
  <TR vAlign=top>
     <TD>
         <TABLE cellSpacing=0 cellPadding=0 border=0>
            <TR>
               <TD><IMG height=33 src="http://images.kbench.com/n_img/newmenu/sub_conor_1.gif"  width=14></TD>
               <TD style="BACKGROUND-POSITION: 0% 0%; BACKGROUND-IMAGE: url(http://images.kbench.com/n_img/newmenu/sub_back.gif); BACKGROUND-REPEAT: repeat-x">
                <P class=sub_menu>  <A  href="http://www.kbench.com/hardware/?cc=1">전체</A> l <A  href="http://www.kbench.com/hardware/?cc=5">CPU</A>
                </P></TD>
               <TD><IMG height=33 src="http://images.kbench.com/n_img/newmenu/sub_conor_2.gif" width=14></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></P>
</DIV>
<DIV id=sub2 onmouseover="Roll('2','on');Show('sub2','','show')" style="Z-INDEX: 200; VISIBILITY: hidden; POSITION: absolute"  onmouseout="Roll('2','off');Show('sub2','','hide');">
<P style="MARGIN-LEFT: 50px">
<TABLE cellSpacing=0 cellPadding=0 border=0>
                    <TBODY>
                    <TR vAlign=top>
                      <TD>
                        <TABLE cellSpacing=0 cellPadding=0 border=0>
                          <TBODY>
                          <TR>
                            <TD><IMG height=33
                              src="http://images.kbench.com/n_img/newmenu/sub_conor_1.gif"
                              width=14></TD>
                            <TD
                            style="BACKGROUND-POSITION: 0% 0%; BACKGROUND-IMAGE: url(http://images.kbench.com/n_img/newmenu/sub_back.gif); BACKGROUND-REPEAT: repeat-x">
                              <P class=sub_menu>  <A
                              href="http://www.kbench.com/digital/?cc=1">전체</A>
                                </P></TD>
                            <TD><IMG height=33
                              src="http://images.kbench.com/n_img/newmenu/sub_conor_2.gif"
                              width=14></TD></TR>
                           </TABLE></TD></TR>
</TABLE></P>
</DIV>
                  <DIV id=sub3
                  onmouseover="Roll('3','on');Show('sub3','','show')"
                  style="Z-INDEX: 200; VISIBILITY: hidden; POSITION: absolute"
                  onmouseout="Roll('3','off');Show('sub3','','hide');">333</DIV>
                  <DIV id=sub4
                  onmouseover="Roll('4','on');Show('sub4','','show')"
                  style="Z-INDEX: 200; VISIBILITY: hidden; POSITION: absolute"
                  onmouseout="Roll('4','off');Show('sub4','','hide')">444
                  <P style="MARGIN-LEFT: 200px"></DIV>
<!-- End Save for Web Slices -->
</body>
</html>

이런식으로 하네요 ;;;;

[이 게시물은 관리자님에 의해 2011-10-31 16:57:14 JavaScript에서 이동 됨]

첨부파일

333.jpg (25.8 KB)
0회 2009-02-13 20:52
|

댓글 1개

우와 이거 진짜 필요햇었는데..감사합니다앗
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
16년 전 조회 1,793
16년 전 조회 1,474
16년 전 조회 1,938
16년 전 조회 1,849
16년 전 조회 1,853
16년 전 조회 1,638
16년 전 조회 2,398
16년 전 조회 2,020
16년 전 조회 2,191
16년 전 조회 2,416
16년 전 조회 1,690
16년 전 조회 2,577
16년 전 조회 2,466
16년 전 조회 4,752
16년 전 조회 1,530
16년 전 조회 1,273
16년 전 조회 2,229
16년 전 조회 2,193
16년 전 조회 1,739
16년 전 조회 2,308
16년 전 조회 2,507
16년 전 조회 1,613
16년 전 조회 1,973
16년 전 조회 2,141
16년 전 조회 1,231
16년 전 조회 1,942
16년 전 조회 1,621
16년 전 조회 2,118
16년 전 조회 1,538
16년 전 조회 2,441
16년 전 조회 2,109
16년 전 조회 6,139
16년 전 조회 2,126
16년 전 조회 3,914
16년 전 조회 1,669
16년 전 조회 1,964
16년 전 조회 2,308
16년 전 조회 2,833
16년 전 조회 2,532
16년 전 조회 2,968
17년 전 조회 3,215
17년 전 조회 3,230
17년 전 조회 2,030
17년 전 조회 1,748
17년 전 조회 1,615
17년 전 조회 1,949
17년 전 조회 1,428
17년 전 조회 2,186
17년 전 조회 1,959
17년 전 조회 1,811
17년 전 조회 1,519
17년 전 조회 2,389
17년 전 조회 3,454
17년 전 조회 2,357
17년 전 조회 1,959
17년 전 조회 1,732
17년 전 조회 2,255
17년 전 조회 4,945
17년 전 조회 1,665
17년 전 조회 2,403
17년 전 조회 2,359
17년 전 조회 2,638
17년 전 조회 2,351
17년 전 조회 4,674
17년 전 조회 3,171
17년 전 조회 3,087
17년 전 조회 1,796
17년 전 조회 1,451
17년 전 조회 4,185
17년 전 조회 1,854
17년 전 조회 1,856
17년 전 조회 2,335
17년 전 조회 2,097
17년 전 조회 1,732
17년 전 조회 4,155
17년 전 조회 1,979
17년 전 조회 3,319
17년 전 조회 3,247
17년 전 조회 1,240
17년 전 조회 2,056
17년 전 조회 1,814
17년 전 조회 2,060
17년 전 조회 2,878
17년 전 조회 3,243
17년 전 조회 3,446
17년 전 조회 3,547
17년 전 조회 1,656
17년 전 조회 1,644
17년 전 조회 2,447
17년 전 조회 2,208
17년 전 조회 2,493
17년 전 조회 3,031
17년 전 조회 3,510
17년 전 조회 2,592
17년 전 조회 1,867
17년 전 조회 3,449
17년 전 조회 3,294
17년 전 조회 3,259
17년 전 조회 4,136
17년 전 조회 2,782