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

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,853
16년 전 조회 1,528
16년 전 조회 1,989
16년 전 조회 1,902
16년 전 조회 1,911
16년 전 조회 1,695
16년 전 조회 2,453
16년 전 조회 2,073
16년 전 조회 2,250
16년 전 조회 2,473
16년 전 조회 1,754
16년 전 조회 2,624
16년 전 조회 2,518
16년 전 조회 4,816
16년 전 조회 1,597
16년 전 조회 1,331
16년 전 조회 2,284
16년 전 조회 2,247
16년 전 조회 1,801
16년 전 조회 2,358
16년 전 조회 2,570
16년 전 조회 1,666
16년 전 조회 2,028
16년 전 조회 2,207
16년 전 조회 1,300
16년 전 조회 1,998
16년 전 조회 1,680
16년 전 조회 2,177
16년 전 조회 1,596
16년 전 조회 2,488
16년 전 조회 2,167
16년 전 조회 6,184
16년 전 조회 2,184
16년 전 조회 3,972
16년 전 조회 1,726
16년 전 조회 2,012
16년 전 조회 2,367
16년 전 조회 2,890
16년 전 조회 2,595
17년 전 조회 3,027
17년 전 조회 3,264
17년 전 조회 3,279
17년 전 조회 2,084
17년 전 조회 1,809
17년 전 조회 1,675
17년 전 조회 2,003
17년 전 조회 1,490
17년 전 조회 2,235
17년 전 조회 2,003
17년 전 조회 1,867
17년 전 조회 1,566
17년 전 조회 2,441
17년 전 조회 3,509
17년 전 조회 2,410
17년 전 조회 2,008
17년 전 조회 1,792
17년 전 조회 2,312
17년 전 조회 4,996
17년 전 조회 1,714
17년 전 조회 2,449
17년 전 조회 2,415
17년 전 조회 2,682
17년 전 조회 2,405
17년 전 조회 4,726
17년 전 조회 3,220
17년 전 조회 3,134
17년 전 조회 1,850
17년 전 조회 1,509
17년 전 조회 4,239
17년 전 조회 1,911
17년 전 조회 1,908
17년 전 조회 2,393
17년 전 조회 2,159
17년 전 조회 1,795
17년 전 조회 4,204
17년 전 조회 2,035
17년 전 조회 3,376
17년 전 조회 3,302
17년 전 조회 1,294
17년 전 조회 2,111
17년 전 조회 1,864
17년 전 조회 2,119
17년 전 조회 2,928
17년 전 조회 3,288
17년 전 조회 3,491
17년 전 조회 3,606
17년 전 조회 1,702
17년 전 조회 1,697
17년 전 조회 2,506
17년 전 조회 2,250
17년 전 조회 2,542
17년 전 조회 3,081
17년 전 조회 3,564
17년 전 조회 2,637
17년 전 조회 1,912
17년 전 조회 3,497
17년 전 조회 3,338
17년 전 조회 3,309
17년 전 조회 4,191
17년 전 조회 2,828