펼침메뉴관련 질문입니다. > 그누4 질문답변

그누4 질문답변

그누보드4 관련 질문은 QA 로 이전됩니다. QA 그누보드4 바로가기
기존 게시물은 열람만 가능합니다.

펼침메뉴관련 질문입니다. 정보

펼침메뉴관련 질문입니다.

본문

<!DOCTYPE html>
<html>
<head>


    <script type="text/javascript">
    var TimeOut        = 300;
    var currentLayer    = null;
    var currentitem    = null;
    var currentLayerNum = 0;
    var noClose        = 0;
    var closeTimer      = null;

    function mopen(n) {
        var l  = document.getElementById("menu"+n);
        var mm = document.getElementById("mmenu"+n); 
        if(l) {
            mcancelclosetime();
            l.style.visibility='visible';
            if(currentLayer && (currentLayerNum != n))
                currentLayer.style.visibility='hidden';
            currentLayer = l;
            currentitem = mm;
            currentLayerNum = n;           
        }  else if(currentLayer) {
            currentLayer.style.visibility='hidden';
            currentLayerNum = 0;
            currentitem = null;
            currentLayer = null;
        }
    }
    function mclosetime() {
        closeTimer = window.setTimeout(mclose, TimeOut);
    }
    function mcancelclosetime() {
        if(closeTimer) {
            window.clearTimeout(closeTimer);
            closeTimer = null;
        }
    }
    function mclose() {
        if(currentLayer && noClose!=1) {
            currentLayer.style.visibility='hidden';
            currentLayerNum = 0;
            currentLayer = null;
            currentitem = null;
        } else {
            noClose = 0;
        }
        currentLayer = null;
        currentitem = null;
    }
    document.onclick = mclose;
    </script>

<style type="text/css">
      #ddd { margin: 0; padding: 0 }
      #ddd li{ margin: 0; padding: 0; list-style: none; float: left; font: bold 12px 굴림 }
      #ddd li a.menu1{ display: block; text-align: center; background: #ffffff; padding: 0px 1px; margin: 0 1px 0 0; color: #FFF; width: 960px; text-decoration: none}
      #ddd li a.menu:hover{ background: #49A3FF }
      .submenu{
background: #009ee2;
border: 0px solid #5E5E5E;
width:924px;
visibility: hidden;
position: absolute;
z-index: 3;
left: 28px;
height: 81px;
}
      .submenu a { display: block; font: 12px 굴림; text-align: left; width:130px; text-decoration: none; padding: 1px; color: #ffffff }
      .submenu a:hover { width:500px; background: #49A3FF; color: #FFF }
    </style>
  </head>

  <body>


     
        <!--begin wijmo menu-->
<ul id="ddd">
            <li><a href="#" class="menu1" id="mmenu1" onmouseover="mopen(1);" onmouseout="mclosetime();"><img src="menu.gif" width="960" border="0"></a>
                <div class="submenu" id="menu1" onmouseover="mcancelclosetime()" onmouseout="mclosetime();">
                    <a href="#">회사 소개</a><a href="#">회사 소개</a>
                    <a href="#">오시는 길</a>
                </div>
            </li>
        </ul>
        <!--end wijmo menu-->
         
     
  </body>
</html>

=====================================================================================
위 소스를 통해
제가 디자인한 메뉴처럼 만들수 없을가요??
전체적인 메뉴가 펼쳐지는 것이지요.

댓글 전체

전체 66,554 |RSS
그누4 질문답변 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1402호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT