스킨사용법관련 문의 (3차 메뉴)
본문
3단메뉴 스킨 관련해서 문의 드립니다.
정말 꼭 필요료한 스킨인데 2단메뉴까지 밖에 안나오는데 어느부분을 수정을해야 3차스킨까지 나올지 궁금합니다.
.gnb_2dli_over .gnb_3da {display:block; < 이부분을 삭제할시 나오는건 알고있지만.
2차 카테고리 마우스 오바시 3차가 보여지게끔 하고싶습니다.
<?php
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.G5_SHOP_SKIN_URL.'/style.css">', 0);
?>
<style>
/* aside:gnb */
#gnb {margin:0 0 5px;padding:0 0 10px;border:1px solid #d5d5d5;background:#f2f5f9}
#gnb h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.gnb_1dli {position:relative}
.gnb_1dli_on {color:#000;text-decoration:none}
.gnb_1da {display:block;padding:7px 10px;border-bottom:1px solid #f4f4f4;background-color:#fff;font-weight:bold;text-decoration:none}
.gnb_1dam {background:url('img/gnb_bg00.gif') #fff center right no-repeat}
.gnb_1dli_on .gnb_1da {background-color:#626870;color:#333;text-decoration:none}
.gnb_1dli_on .gnb_1dam {background:url('img/gnb_bg01.gif') #626870 center right no-repeat;color:#333;text-decoration:none}
.gnb_2dul {display:none;z-index:1000;position:absolute;border:1px solid #787f89}
.gnb_2dli {position:relative}
.gnb_1dli_over .gnb_2dul, .gnb_1dli_over2 .gnb_2dul {display:block;top:0;left:127px;width:130px;background:#fff}
a.gnb_2da {display:none;text-decoration:none}
a.gnb_2dam {background:url('img/gnb_bg00.gif') #fff center right no-repeat;text-decoration:none}
a.gnb_2da:focus, a.gnb_2da:hover, a.gnb_2dam:focus, a.gnb_2dam:hover {background-color:#f2f5f9}
.gnb_1dli_over .gnb_2da {display:block;padding:10px;border-bottom:1px solid #e9e9e9}
.gnb_3dul {display:none;z-index:1001;position:absolute;top:0;left:127px;margin:0;padding:0;width:130px;border:1px solid #787f89;background:#fff;list-style:none}
.gnb_2dli_over .gnb_3dul, .gnb_2dli_over2 .gnb_3dul {display:block}
.gnb_2dli_over .gnb_3da {display:block;padding:10px;color:#333;border-bottom:1px solid #e9e9e9}
.gnb_3da:focus, .gnb_3da:hover {background:#f2f5f9;color:#333;text-decoration:none}
</style>
<!-- 쇼핑몰 카테고리 시작 { -->
<nav id="gnb">
<h2>쇼핑몰 카테고리</h2>
<ul id="gnb_1dul">
<?php
// 1단계 분류 판매 가능한 것만
$hsql = " select ca_id, ca_name from {$g5['g5_shop_category_table']} where length(ca_id) = '2' and ca_use = '1' order by ca_order, ca_id ";
$hresult = sql_query($hsql);
$gnb_zindex = 999; // gnb_1dli z-index 값 설정용
for ($i=0; $row=sql_fetch_array($hresult); $i++)
{
$gnb_zindex -= 1; // html 구조에서 앞선 gnb_1dli 에 더 높은 z-index 값 부여
// 2단계 분류 판매 가능한 것만
$sql2 = " select ca_id, ca_name from {$g5['g5_shop_category_table']} where LENGTH(ca_id) = '4' and SUBSTRING(ca_id,1,2) = '{$row['ca_id']}' and ca_use = '1' order by ca_order, ca_id ";
$result2 = sql_query($sql2);
$count = mysql_num_rows($result2);
?>
<li class="gnb_1dli" style="z-index:<?php echo $gnb_zindex; ?>">
<a href="<?php echo G5_SHOP_URL.'/list.php?ca_id='.$row['ca_id']; ?>" class="gnb_1da<?php if ($count) echo ' gnb_1dam'; ?>"><?php echo $row['ca_name']; ?></a>
<?php
for ($j=0; $row2=sql_fetch_array($result2); $j++)
{
$result3 = sql_query(" select ca_id, ca_name from {$g5['g5_shop_category_table']} where LENGTH(ca_id) = '6' and SUBSTRING(ca_id,1,4) = '{$row2['ca_id']}' and ca_use = '1' order by ca_id "); // 3단분류
if ($j==0) echo '<ul class="gnb_2dul" style="z-index:'.$gnb_zindex.'">';
?>
<li class="gnb_2dli">
<a href="<?php echo G5_SHOP_URL; ?>/list.php?ca_id=<?php echo $row2['ca_id']; ?>" class="gnb_2da"><?php echo $row2['ca_name']; ?></a>
<?php
for ($k=0;$row3=sql_fetch_array($result3);$k++) {
if ($k==0) echo '<ul class="gnb_3dul">';
?>
<li class="gnb_3dli"><a href="<?php echo G5_SHOP_URL.'/list.php?ca_id='.$row3['ca_id']; ?>" class="gnb_3da"><?php echo $row3['ca_name']; ?></a></li>
<?php }
if ($k>0) echo '</ul>';
?>
</li>
<?php }
if ($j>0) echo '</ul>';
?>
</li>
<?php } ?>
</ul>
</nav>
<!-- } 쇼핑몰 카테고리 끝 -->
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");
var $gnb_2da = $(".gnb_2da");
$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");
hide_menu = false;
}
});
$gnb.mouseout(function() {
hide_menu = true;
});
$gnb_2da.mouseover(function() {
if(mouse_event) {
$(".gnb_2dli").removeClass("gnb_2dli_over gnb_2dli_over2 gnb_2dli_on");
$(this).parent().addClass("gnb_2dli_over gnb_2dli_on");
hide_menu = false;
}
});
$gnb_2da.mouseout(function() {
hide_menu = true;
});
$(".gnb_2dli").mouseover(function() {
hide_menu = false;
});
$(".gnb_2dli").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");
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");
hide_menu = false;
});
$(".gnb_2da").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");
$(".gnb_2dli").removeClass("gnb_2dli_over gnb_2dli_over2 gnb_2dli_on");
}
답변을 작성하시기 전에 로그인 해주세요.
