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

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,861
16년 전 조회 1,538
16년 전 조회 1,996
16년 전 조회 1,913
16년 전 조회 1,918
16년 전 조회 1,701
16년 전 조회 2,459
16년 전 조회 2,077
16년 전 조회 2,258
16년 전 조회 2,480
16년 전 조회 1,758
16년 전 조회 2,630
16년 전 조회 2,525
16년 전 조회 4,820
16년 전 조회 1,603
16년 전 조회 1,335
16년 전 조회 2,294
16년 전 조회 2,249
16년 전 조회 1,808
16년 전 조회 2,362
16년 전 조회 2,575
16년 전 조회 1,674
16년 전 조회 2,037
16년 전 조회 2,215
16년 전 조회 1,310
16년 전 조회 2,002
16년 전 조회 1,684
16년 전 조회 2,185
16년 전 조회 1,601
16년 전 조회 2,494
16년 전 조회 2,177
16년 전 조회 6,187
16년 전 조회 2,191
16년 전 조회 3,977
16년 전 조회 1,730
16년 전 조회 2,016
16년 전 조회 2,376
16년 전 조회 2,894
16년 전 조회 2,601
17년 전 조회 3,032
17년 전 조회 3,270
17년 전 조회 3,287
17년 전 조회 2,092
17년 전 조회 1,817
17년 전 조회 1,683
17년 전 조회 2,009
17년 전 조회 1,496
17년 전 조회 2,246
17년 전 조회 2,020
17년 전 조회 1,875
17년 전 조회 1,572
17년 전 조회 2,447
17년 전 조회 3,516
17년 전 조회 2,417
17년 전 조회 2,012
17년 전 조회 1,798
17년 전 조회 2,317
17년 전 조회 4,997
17년 전 조회 1,716
17년 전 조회 2,455
17년 전 조회 2,418
17년 전 조회 2,689
17년 전 조회 2,410
17년 전 조회 4,730
17년 전 조회 3,227
17년 전 조회 3,143
17년 전 조회 1,858
17년 전 조회 1,515
17년 전 조회 4,244
17년 전 조회 1,914
17년 전 조회 1,913
17년 전 조회 2,395
17년 전 조회 2,162
17년 전 조회 1,797
17년 전 조회 4,215
17년 전 조회 2,042
17년 전 조회 3,383
17년 전 조회 3,306
17년 전 조회 1,297
17년 전 조회 2,115
17년 전 조회 1,868
17년 전 조회 2,127
17년 전 조회 2,933
17년 전 조회 3,290
17년 전 조회 3,492
17년 전 조회 3,610
17년 전 조회 1,704
17년 전 조회 1,701
17년 전 조회 2,507
17년 전 조회 2,257
17년 전 조회 2,543
17년 전 조회 3,090
17년 전 조회 3,569
17년 전 조회 2,644
17년 전 조회 1,917
17년 전 조회 3,501
17년 전 조회 3,345
17년 전 조회 3,313
17년 전 조회 4,195
17년 전 조회 2,831