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

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,652
16년 전 조회 1,321
16년 전 조회 1,789
16년 전 조회 1,687
16년 전 조회 1,701
16년 전 조회 1,489
16년 전 조회 2,250
16년 전 조회 1,874
16년 전 조회 2,040
16년 전 조회 2,256
16년 전 조회 1,548
16년 전 조회 2,378
16년 전 조회 2,320
16년 전 조회 4,597
16년 전 조회 1,366
16년 전 조회 1,122
16년 전 조회 2,073
16년 전 조회 2,047
16년 전 조회 1,583
16년 전 조회 2,111
16년 전 조회 2,350
16년 전 조회 1,458
16년 전 조회 1,803
16년 전 조회 1,992
16년 전 조회 1,080
16년 전 조회 1,761
16년 전 조회 1,470
16년 전 조회 1,972
16년 전 조회 1,385
16년 전 조회 2,276
16년 전 조회 1,961
16년 전 조회 5,934
16년 전 조회 1,984
16년 전 조회 3,751
16년 전 조회 1,539
16년 전 조회 1,822
16년 전 조회 2,137
16년 전 조회 2,679
16년 전 조회 2,380
16년 전 조회 2,817
16년 전 조회 3,053
16년 전 조회 3,079
16년 전 조회 1,886
16년 전 조회 1,602
16년 전 조회 1,474
16년 전 조회 1,790
16년 전 조회 1,271
16년 전 조회 2,034
16년 전 조회 1,808
17년 전 조회 1,675
17년 전 조회 1,362
17년 전 조회 2,233
17년 전 조회 3,297
17년 전 조회 2,220
17년 전 조회 1,809
17년 전 조회 1,574
17년 전 조회 2,104
17년 전 조회 4,794
17년 전 조회 1,484
17년 전 조회 2,212
17년 전 조회 2,185
17년 전 조회 2,465
17년 전 조회 2,210
17년 전 조회 4,499
17년 전 조회 3,000
17년 전 조회 2,939
17년 전 조회 1,658
17년 전 조회 1,304
17년 전 조회 4,021
17년 전 조회 1,682
17년 전 조회 1,681
17년 전 조회 2,180
17년 전 조회 1,953
17년 전 조회 1,572
17년 전 조회 3,984
17년 전 조회 1,820
17년 전 조회 3,200
17년 전 조회 3,073
17년 전 조회 1,104
17년 전 조회 1,911
17년 전 조회 1,673
17년 전 조회 1,921
17년 전 조회 2,702
17년 전 조회 3,101
17년 전 조회 3,279
17년 전 조회 3,393
17년 전 조회 1,532
17년 전 조회 1,489
17년 전 조회 2,316
17년 전 조회 2,043
17년 전 조회 2,360
17년 전 조회 2,882
17년 전 조회 3,331
17년 전 조회 2,427
17년 전 조회 1,694
17년 전 조회 3,278
17년 전 조회 3,133
17년 전 조회 3,113
17년 전 조회 3,981
17년 전 조회 2,653