diff --git a/css/admin.css b/css/admin.css index d7af73280..686f4502e 100644 --- a/css/admin.css +++ b/css/admin.css @@ -67,28 +67,28 @@ h2 {font-size:1.2em} /* gnb js off */ #gnb {z-index:12;background:#383a3f} #gnb h2 {margin:0;padding:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden} -#gnb_ul {margin:0 auto;padding:0;width:1000px;zoom:1} -#gnb_ul:after {display:block;visibility:hidden;clear:both;content:""} -.gnb_1depth {z-index:13;clear:both;zoom:1} -.gnb_1depth:after {display:block;visibility:hidden;clear:both;content:""} -.gnb_1depth a {display:block;float:left;width:120px;height:35px;color:#e0e0e0;font-weight:bold;line-height:2.95em;text-decoration:none} -.gnb_1depth a:focus, -.gnb_1depth a:hover {text-decoration:none} -.gnb_sub_ul {float:left;width:auto} -.gnb_2depth {float:left} -.gnb_2depth a {color:#e0e0e0;font-weight:normal} +#gnb_1dul {margin:0 auto;padding:0;width:1000px;zoom:1} +#gnb_1dul:after {display:block;visibility:hidden;clear:both;content:""} +.gnb_1dli {z-index:13;clear:both;zoom:1} +.gnb_1dli:after {display:block;visibility:hidden;clear:both;content:""} +.gnb_1dli a {display:block;float:left;width:120px;height:35px;color:#e0e0e0;font-weight:bold;line-height:2.95em;text-decoration:none} +.gnb_1dli a:focus, +.gnb_1dli a:hover {text-decoration:none} +.gnb_2dul {float:left;width:auto} +.gnb_2dli {float:left} +.gnb_2dli a {color:#e0e0e0;font-weight:normal} /* gnb js on */ .gnb_js {padding-left:1px} -.gnb_js #gnb_ul {zoom:1} -.gnb_js #gnb_ul:after {display:block;visibility:hidden;clear:both;content:""} -.gnb_js .gnb_1depth {clear:none;position:relative;float:left;margin:0 0 0 -1px;border:1px solid #222;border-top:0;border-bottom:0} -.gnb_js .gnb_1depth a {color:#fff;text-align:center} -.gnb_js .gnb_1depth_air a {float:none;background:#f7f7f2;color:#000} -.gnb_js .gnb_1depth_on a {float:none;background:#fff;color:#000} -.gnb_js .gnb_sub_ul {position:absolute;top:35px;width:1px;height:1px;overflow:hidden} -.gnb_js .gnb_2depth a {display:inline-block;float:none !important;padding:0 10px;width:161px;text-align:left} -.gnb_1depth_over .gnb_sub_ul {left:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff} -.gnb_1depth_over2 .gnb_sub_ul {right:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff} +.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;margin:0 0 0 -1px;border:1px solid #222;border-top:0;border-bottom:0} +.gnb_js .gnb_1dli a {color:#fff;text-align:center} +.gnb_js .gnb_1dli_air a {float:none;background:#f7f7f2;color:#000} +.gnb_js .gnb_1dli_on a {float:none;background:#fff;color:#000} +.gnb_js .gnb_2dul {position:absolute;top:35px;width:1px;height:1px;overflow:hidden} +.gnb_js .gnb_2dli a {display:inline-block;float:none !important;padding:0 10px;width:161px;text-align:left} +.gnb_1dli_over .gnb_2dul {left:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff} +.gnb_1dli_over2 .gnb_2dul {right:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff} .gnb_js .gnb_grp_style {background:#f7f7f7 !important} .gnb_js .gnb_grp_div {border-top:1px solid #eee} diff --git a/css/default.css b/css/default.css index c498d85bb..03c579a64 100644 --- a/css/default.css +++ b/css/default.css @@ -75,28 +75,30 @@ a:active {color:#000;text-decoration:underline} /* gnb js off */ #gnb {z-index:10;margin:-1px 0 0;border-top:1px solid #e7f1ed;border-bottom:1px solid #c3c7c5;background:#f0f4f8} #gnb h2 {position:absolute;margin:0;padding:0;font-size:0;line-height:0;overflow:hidden} -#gnb_ul {margin:0 auto;padding:0;width:980px;zoom:1} -#gnb_ul:after {display:block;visibility:hidden;clear:both;content:""} -.gnb_1depth {z-index:10;clear:both;zoom:1} -.gnb_1depth:after {display:block;visibility:hidden;clear:both;content:""} -.gnb_1depth a {display:block;float:left;width:80px;height:35px;font-weight:bold;line-height:2.95em;text-decoration:none} -.gnb_1depth a:focus, -.gnb_1depth a:hover {text-decoration:none} -.gnb_1depth ul {float:left;width:auto} -.gnb_2depth {float:left} -.gnb_2depth a {font-weight:normal} +#gnb_1dul {margin:0 auto;padding:0;width:980px;zoom:1} +#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} +.gnb_2da {display:block;float:left;width:80px;height:35px;line-height:2.95em;text-decoration:none} +.gnb_2da:focus, +.gnb_2da:hover {text-decoration:none} /* gnb js on */ .gnb_js {} -.gnb_js #gnb_ul {zoom:1} -.gnb_js #gnb_ul:after {display:block;visibility:hidden;clear:both;content:""} -.gnb_js .gnb_1depth {clear:none;position:relative;float:left} -.gnb_js .gnb_1depth a {text-align:center} -.gnb_js .gnb_1depth_air a {float:none;background:#f7f7f2;color:#000} -.gnb_js .gnb_1depth_on a {float:none;border-color:#e0e5e9;background:#fff;color:#000} -.gnb_js .gnb_sub_ul {position:absolute;top:35px;width:1px;height:1px;overflow:hidden} -.gnb_js .gnb_2depth a {display:inline-block;float:none !important;padding:0 10px;width:161px;text-align:left} -.gnb_1depth_over .gnb_sub_ul {left:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff} -.gnb_1depth_over2 .gnb_sub_ul {right:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff} +.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:#f7f7f2;color:#000} +.gnb_js .gnb_1dli_on a {float:none;border-color:#e0e5e9;background:#fff;color:#000} +.gnb_js .gnb_2dul {position:absolute;top:35px;width:1px;height:1px;overflow:hidden} +.gnb_js .gnb_2da {display:inline-block;float:none !important;padding:0 10px;width:161px;text-align:left} +.gnb_1dli_over .gnb_2dul {left:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff} +.gnb_1dli_over2 .gnb_2dul {right:-1px;width:181px;height:auto;border:1px solid #c3c7c5;border-top:0;background:#fff} .gnb_empty {width:100%;height:35px;text-align:center;line-height:2.95em} diff --git a/css/default_shop.css b/css/default_shop.css index eafec04d0..5b3df2bc1 100644 --- a/css/default_shop.css +++ b/css/default_shop.css @@ -87,15 +87,20 @@ a:active {color:#000;text-decoration:underline} #hd_aside a:focus, #hd_aside a:hover {background:#626870;color:#fff} -/* gnb js off */ +/* gnb */ #gnb {margin:0 0 5px;padding:0 0 10px;border:1px solid #d5d5d5;background:#f7f7f7} #gnb h2 {position:absolute;font-size:0;line-height:0;overflow:hidden} .gnb_1dul {margin:0;border:0;background:#fff;list-style:none} -.gnb_1dli {position:relative} -.gnb_1da {display:block;padding:0 10px;height:33px;border-bottom:1px solid #f4f4f4;background:url('../img/shop/gnb_bg.gif') top right repeat-x;font-weight:bold;text-decoration:none;line-height:2.9em} -.gnb_1da:focus, -.gnb_1da:hover {background-position:right -33px;color:#fff;text-decoration:none} -.gnb_2dul {display:none} +.gnb_1dli {position:relative;background:url('../img/shop/gnb_bg.gif') top right repeat-x} +.gnb_1dli_on {background-position:right -33px;color:#fff;text-decoration:none} +.gnb_1da {display:block;padding:0 10px;height:33px;border-bottom:1px solid #f4f4f4;font-weight:bold;text-decoration:none;line-height:2.9em} +.gnb_1dli_on .gnb_1da {color:#fff;text-decoration:none} +.gnb_2dul {visibility:hidden;z-index:1000;position:absolute;top:0;width:0;height:0;overflow:hidden} +.gnb_1dli_over .gnb_2dul {visibility:visible;left:127px;padding:0 0 5px 20px;width:130px;height:auto;background:url('../img/shop/gnb_2dbg.gif') left 10px no-repeat #626870} +.gnb_1dli_over2 .gnb_2dul {visibility:visible;left:127px;padding:0 0 5px 20px;width:150px;height:auto;background:url('../img/shop/gnb_2dbg.gif') left 10px no-repeat #626870} +.gnb_2da {display:block;height:33px;border-bottom:1px solid #787f89;color:#fff !important;line-height:2.9em} +.gnb_2da:focus, +.gnb_2da:hover {text-decoration:none} /* 중간 레이아웃 */ #wrapper {z-index:5;margin:30px auto;width:1000px;zoom:1} @@ -136,7 +141,7 @@ a:active {color:#000;text-decoration:underline} /* 하단 레이아웃 */ #ft {clear:both;padding:0 0 40px;border-top:1px solid #e9e9e9} #ft h1 {position:absolute;font-size:0;line-height:0;overflow:hidden} -#ft div {position:relative;margin:0 auto;padding:0 0 0 160px;width:820px} +#ft div {position:relative;margin:0 auto;padding:0 0 0 160px;width:840px} #ft_logo {position:absolute;top:0;left:40px} #ft ul {margin:0 0 15px;padding:20px 0 0;zoom:1} #ft ul:after {display:block;visibility:hidden;clear:both;content:''} diff --git a/img/shop/gnb_2dbg.gif b/img/shop/gnb_2dbg.gif new file mode 100644 index 000000000..238fcfbfe Binary files /dev/null and b/img/shop/gnb_2dbg.gif differ diff --git a/js/jquery.menu.js b/js/jquery.menu.js index 8eeea4201..f992825c5 100644 --- a/js/jquery.menu.js +++ b/js/jquery.menu.js @@ -15,11 +15,11 @@ $(function(){ }); // 주메뉴 - var $gnb = $(".gnb_1depth > a"); + var $gnb = $(".gnb_1dli > a"); $gnb.mouseover(function() { if(mouse_event) { - $(".gnb_1depth").removeClass("gnb_1depth_over gnb_1depth_over2 gnb_1depth_on"); - $(this).parent().addClass("gnb_1depth_over gnb_1depth_on"); + $(".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; } @@ -29,17 +29,17 @@ $(function(){ hide_menu = true; }); - $(".gnb_1depth li").mouseover(function() { + $(".gnb_2dli").mouseover(function() { hide_menu = false; }); - $(".gnb_1depth li").mouseout(function() { + $(".gnb_2dli").mouseout(function() { hide_menu = true; }); $gnb.focusin(function() { - $(".gnb_1depth").removeClass("gnb_1depth_over gnb_1depth_over2 gnb_1depth_on"); - $(this).parent().addClass("gnb_1depth_over gnb_1depth_on"); + $(".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; }); @@ -48,18 +48,18 @@ $(function(){ hide_menu = true; }); - $(".gnb_1depth ul a").focusin(function() { - $(".gnb_1depth").removeClass("gnb_1depth_over gnb_1depth_over2 gnb_1depth_on"); - var $gnb_li = $(this).closest(".gnb_1depth").addClass("gnb_1depth_over gnb_1depth_on"); - menu_rearrange($(this).closest(".gnb_1depth")); + $(".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_1depth ul a").focusout(function() { + $(".gnb_2da").focusout(function() { hide_menu = true; }); - $('#gnb_ul>li').bind('mouseleave',function(){ + $('#gnb_1dul>li').bind('mouseleave',function(){ submenu_hide(); }); @@ -70,7 +70,7 @@ $(function(){ }); function submenu_hide() { - $(".gnb_1depth").removeClass("gnb_1depth_over gnb_1depth_over2 gnb_1depth_on"); + $(".gnb_1dli").removeClass("gnb_1dli_over gnb_1dli_over2 gnb_1dli_on"); } // 텍스트 리사이즈 카운트 쿠키있으면 실행 @@ -89,16 +89,16 @@ $(function(){ function menu_rearrange(el) { - var width = $("#gnb_ul").width(); + var width = $("#gnb_1dul").width(); var left = w1 = w2 = 0; - var idx = $(".gnb_1depth").index(el); + var idx = $(".gnb_1dli").index(el); for(i=0; i<=idx; i++) { - w1 = $(".gnb_1depth:eq("+i+")").outerWidth(); - w2 = $(".gnb_2depth > a:eq("+i+")").outerWidth(true); + w1 = $(".gnb_1dli:eq("+i+")").outerWidth(); + w2 = $(".gnb_2dli > a:eq("+i+")").outerWidth(true); if((left + w2) > width) { - el.removeClass("gnb_1depth_over").addClass("gnb_1depth_over2"); + el.removeClass("gnb_1dli_over").addClass("gnb_1dli_over2"); } left += w1; diff --git a/shop/boxcategory.inc.php b/shop/boxcategory.inc.php index e65e112da..78ee73e34 100644 --- a/shop/boxcategory.inc.php +++ b/shop/boxcategory.inc.php @@ -10,7 +10,7 @@ $sub_menu_left = 100; // 2단계 메뉴 왼쪽 좌표 (1단계 좌표에서 부