상단 2열 메뉴 > 그누보드5 팁자료실

그누보드5 팁자료실

상단 2열 메뉴 정보

상단 2열 메뉴

첨부파일

tip1.jpg (69.6K) 30회 다운로드 2014-01-30 11:55:13

본문

제대로 한 것인지 모르겠지만 이리하니 되긴 되네요...

head.php 파일 수정


                <ul class="gnb_2dul">
                    <?php
                    $sql2 = " select * from {$g5['board_table']} where gr_id = '{$row['gr_id']}' and bo_show_menu = '1' and bo_device <> 'mobile' order by bo_order ";
                    $result2 = sql_query($sql2);
                    for ($bi=0; $row2=sql_fetch_array($result2); $bi++) { // bi 는 board index
if ($bi == 0 || (($bi % 2) == 0)) {
                    ?>
                    <li class="gnb_2dli"><a href="<?php echo G5_BBS_URL ?>/board.php?bo_table=<?php echo $row2['bo_table'] ?>" class="gnb_2da"><?php echo $row2['bo_subject'] ?></a></li>
                    <?php } else { ?>
                    <li class="gnb_2dli_2"><a href="<?php echo G5_BBS_URL ?>/board.php?bo_table=<?php echo $row2['bo_table'] ?>" class="gnb_2da_2"><?php echo $row2['bo_subject'] ?></a></li>
                    <?php }
} ?>
                </ul>


defalut.css 파일 수정


/* gnb js off */
#gnb {position:relative;margin:-1px 0 0;border-top:1px dotted #dde4e9;border-bottom:1px solid #dde4e9;background:#ecf0f7}
#gnb h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#gnb #gnb_1dul {margin:0 auto !important;padding:0;width:970px;zoom:1}
#gnb #gnb_1dul:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_1dli {z-index:10;clear:both;zoom:1}
.gnb_1dli:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_1da {display:block;float:left;width:80px;height:35px;font-weight:bold;line-height:2.95em;text-decoration:none}
.gnb_1da:focus, .gnb_1da:hover {text-decoration:none}
.gnb_2dul {float:left;width:auto}
.gnb_2dli {float:left;width:180px;}
.gnb_2da {display:block;float:left;width:100px;height:30px;line-height:2.95em;text-decoration:none}
.gnb_2da:focus, .gnb_2da:hover {text-decoration:none}

.gnb_2dli_2 {float:left;width:180px;position:relative;top:-30px;left:181px}
.gnb_2da_2 {display:block;float:left;width:100px;height:30px;line-height:2.95em;text-decoration:none;position:absolute}
.gnb_2da_2:focus, .gnb_2da_2:hover {text-decoration:none}
/* gnb js on */
.gnb_js {}
.gnb_js #gnb_1dul {zoom:1}
.gnb_js #gnb_1dul:after {display:block;visibility:hidden;clear:both;content:""}
.gnb_js .gnb_1dli {clear:none;position:relative;float:left}
.gnb_js .gnb_1da {text-align:center}
.gnb_js .gnb_1dli_air a {float:none;background:#333;color:#fff}
.gnb_js .gnb_1dli_on a {float:none;background:#333;color:#fff}
.gnb_js .gnb_2dul {display:none;position:absolute;top:35px}
.gnb_js .gnb_2da {display:inline-block;float:none !important;padding:0 10px;width:161px;text-align:left}
.gnb_js .gnb_2da_2 {display:inline-block;float:none !important;padding:0 10px;width:161px;text-align:left}
.gnb_1dli_over .gnb_2dul {display:block;left:0;width:180px;background:#fff}
.gnb_1dli_over2 .gnb_2dul {display:block;right:1px;width:180px;background:#fff}

.gnb_empty {width:100%;height:35px;text-align:center;line-height:2.95em}



jquery.menu.js 파일 수정


$(function(){
    var hide_menu = false;
    var mouse_event = false;
    var oldX = oldY = 0;

    $(document).mousemove(function(e) {
        if(oldX == 0) {
            oldX = e.pageX;
            oldY = e.pageY;
        }

        if(oldX != e.pageX || oldY != e.pageY) {
            mouse_event = true;
        }
    });

    // 주메뉴
    var $gnb = $(".gnb_1dli > a");
    $gnb.mouseover(function() {
        if(mouse_event) {
            $(".gnb_1dli").removeClass("gnb_1dli_over gnb_1dli_over2 gnb_1dli_on");
            $(this).parent().addClass("gnb_1dli_over gnb_1dli_on");
            menu_rearrange($(this).parent());
            hide_menu = false;
        }
    });

    $gnb.mouseout(function() {
        hide_menu = true;
    });

    $(".gnb_2dli").mouseover(function() {
        hide_menu = false;
    });

    $(".gnb_2dli").mouseout(function() {
        hide_menu = true;
    });

    $(".gnb2_2dli_2").mouseover(function() {
        hide_menu = false;
    });

    $(".gnb2_2dli_2").mouseout(function() {
        hide_menu = true;
    });

    $gnb.focusin(function() {
        $(".gnb_1dli").removeClass("gnb_1dli_over gnb_1dli_over2 gnb_1dli_on");
        $(this).parent().addClass("gnb_1dli_over gnb_1dli_on");
        menu_rearrange($(this).parent());
        hide_menu = false;
    });

    $gnb.focusout(function() {
        hide_menu = true;
    });

    $(".gnb_2da").focusin(function() {
        $(".gnb_1dli").removeClass("gnb_1dli_over gnb_1dli_over2 gnb_1dli_on");
        var $gnb_li = $(this).closest(".gnb_1dli").addClass("gnb_1dli_over gnb_1dli_on");
        menu_rearrange($(this).closest(".gnb_1dli"));
        hide_menu = false;
    });

    $(".gnb_2da").focusout(function() {
        hide_menu = true;
    });

    $(".gnb_2da_2").focusin(function() {
        $(".gnb_1dli").removeClass("gnb_1dli_over gnb_1dli_over2 gnb_1dli_on");
        var $gnb_li = $(this).closest(".gnb_1dli").addClass("gnb_1dli_over gnb_1dli_on");
        menu_rearrange($(this).closest(".gnb_1dli"));
        hide_menu = false;
    });

    $(".gnb_2da_2").focusout(function() {
        hide_menu = true;
    });

    $('#gnb_1dul>li').bind('mouseleave',function(){
        submenu_hide();
    });

    $(document).bind('click focusin',function(){
        if(hide_menu) {
            submenu_hide();
        }
    });
});

function submenu_hide() {
    $(".gnb_1dli").removeClass("gnb_1dli_over gnb_1dli_over2 gnb_1dli_on");
}

function menu_rearrange(el)
{
    var width = $("#gnb_1dul").width();
    var left = w1 = w2 = w3 = 0;
    var idx = $(".gnb_1dli").index(el);

    for(i=0; i<=idx; i++) {
        w1 = $(".gnb_1dli:eq("+i+")").outerWidth();
        w2 = $(".gnb_2dli > a:eq("+i+")").outerWidth(true);
        w2 = $(".gnb_2dli_2 > a:eq("+i+")").outerWidth(true);

        if((left + w2 + w3) > width) {
            el.removeClass("gnb_1dli_over").addClass("gnb_1dli_over2");
        }

        left += w1;
    }
}
추천
1

댓글 5개

전체 2,431 |RSS
그누보드5 팁자료실 내용 검색

회원로그인

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