상단 2열 메뉴

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

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;
}
}