메뉴 하위에 마우스를 가져가면 하위 메뉴 나타내기 > JavaScript

본문 바로가기

사이트 내 전체검색

뒤로가기 JavaScript

메뉴 하위에 마우스를 가져가면 하위 메뉴 나타내기

페이지 정보

작성자 최고관리자 작성일 21-02-10 17:28 조회 6,788 댓글 0

본문

<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
 <script language="JavaScript">
 <!--
function MM_findObj(n, d) { //v3.0
  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); return x;
 }

 function MM_showHideLayers() { //v3.0
  var i,p,v,obj,args=MM_showHideLayers.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 MM_openBrWindow(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
 }
 //-->
 </script>
 </head>

 <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" bgcolor="#31B2C8">

 <div id="m1" style="position:absolute; left:10px; top:56px; width:450px; height:15px; z-index:1; background-color: #ffffff; layer-background-color: #31B2C8; border: 1px none #000000; visibility: hidden">
    <table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%" vspace="0" hspace="0">
        <tr valign="bottom">
            <td>
                <font face="굴림, 돋움" color="#6666FF">  <a href="water/meaning.htm" target="body">하위메뉴1-1</a> |
                <a href="water/human.htm" target="body">하위메뉴1-2</a> |
                <a href="water/drink_law.htm" target="body">하위메뉴1-3</a> |
                <a href="water/misunderstanding.htm" target="body">하위메뉴1-4</a> |
                <a href="water/acidity.htm" target="body">하위메뉴1-5</a></font>
            </td>
        </tr>
    </table>
 </div>

 <div id="m2" style="position:absolute; left:132px; top:56px; width:346px; height:15px; z-index:2; visibility: hidden; background-color: #ffffff; layer-background-color: #31B2C8; border: 1px none #000000">
    <table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%" vspace="0" hspace="0">
        <tr valign="bottom">
            <td>
                <font face="굴림, 돋움" color="#6666FF">  <a href="filter/filter_main.htm#a" target="body">하위메뉴2-1</a> |
                <a href="filter/filter_main.htm#b" target="body">하위메뉴2-2</a> |
                <a href="filter/filter_main.htm#c" target="body">하위메뉴2-3</a> |
                <a href="filter/filter_main.htm#d" target="body">하위메뉴2-4</a></font>
            </td>
        </tr>
    </table>
 </div>

 <div id="m3" style="position:absolute; left:204px; top:56px; width:400px; height:15px; z-index:3; visibility: hidden; background-color: #ffffff; layer-background-color: #31B2C8; border: 1px none #000000">
    <table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%" vspace="0" hspace="0">
        <tr valign="bottom">
            <td>
                <font face="굴림, 돋움" color="#6666FF">  <a href="cleanwater/shape.htm" target="body">하위메뉴3-1</a> |
                <a href="cleanwater/method.htm" target="body">하위메뉴3-2</a> |
                <a href="cleanwater/reverse.htm" target="body">하위메뉴3-3</a> |
                <a href="cleanwater/uf.htm" target="body">하위메뉴3-4</a></font>
            </td>
        </tr>
    </table>
 </div>



 <table width="100%" border="0" cellspacing="0" cellpadding="0" height="77" vspace="0" hspace="0">

    <tr>
        <td background="images/top_menu_bg.gif" height="20">
            <table border="0" cellspacing="1" cellpadding="0" height="100%" vspace="0" hspace="0" width="590">
                <tr valign="middle">
                    <td width="60" height="14">
                        <div align="center">
                            <font face="굴림, 돋움" size="2"><a href="#" onMouseOver="MM_showHideLayers('m1','','show','m2','','hide','m3','','hide')">상위메뉴1</a></font>
                        </div>
                    </td>
                    <td width="70" height="14">
                          <div align="center">
                              <font face="굴림, 돋움" size="2"><a href="filter/filter_main.htm" onMouseOver="MM_showHideLayers('m1','','hide','m2','','show','m3','','hide')" target="body">상위메뉴2</a></font>
                          </div>
                      </td>
                      <td width="70" height="14">
                          <div align="center">
                              <font face="굴림, 돋움" size="2"><a href="#" onMouseOver="MM_showHideLayers('m1','','hide','m2','','hide','m3','','show')">상위메뉴2</a></font>
                          </div>
                      </td>
                  </tr>
              </table>
          </td>
      </tr>
 </table>
 </body>
 </html>

댓글목록 0

등록된 댓글이 없습니다.

Copyright © beautipia.co.kr. All rights reserved.

contact : webmaster@beautipia.co.kr

PC 버전으로 보기