제이쿼리드롭다운 - 마우스 온 - 2차메뉴 나올때 본문이 아래로 밀리는문제..
본문
드롭다운 메뉴에서 마우스 온 할때 2차메뉴 나오는 부분이 딱 나오면...
아래 위치한 본문이 2차메뉴 높이 만큼 아래로 밀립니다.. 밀리지 않게 수정하려면 어떻게 해야 하나요?
좀 가르쳐주세요......^^;;
------------------------------------css---------------------------------
#gnb {z-index:10;position:relative; top:0px;height:90px;width:100%;}
#gnb ul li { list-style:none; text-decoration:none; }
#gnb li { list-style:none; text-decoration:none; }
#gnb:after {display:block; content:"";clear:both;}
#gnb .gnb_wrap{/*position:absolute;*width:1180px;/*height:90px;*margin:0 auto;}
#gnb .gnb_wrap:after {display:block; content:"";clear:both;}
#gnb .gnb_wrap h1 {float:left; padding: 18px 0 21px 4px;}
#gnb .gnb_wrap>ul{float:right;margin:0 auto; padding-top:30px;width:890px;}
#gnb .gnb_wrap>ul:after {display:block; content:"";clear:both;}
#gnb .gnb_wrap>ul>li{height:90px; line-height:40px;padding:0 3px 0 40px;/*width:178px*;text-align:center;float:left;}
#gnb .gnb_wrap>ul>li a.dep01{color:#a1a1a1; font-size:22px;font-weight:600; color:#343434; font-weight:bold;letter-spacing:-1px;text-decoration:none; }
#gnb .gnb_wrap>ul>li.slc a.dep01{color:#febd17;}
#gnb .gnb_wrap>ul>li.ov a.dep01{color:#636363;}
#gnb .gnb_wrap>ul>li.on a.dep01{display:block; background:#f7f7f7;color:#197CB9;}
#gnb .gnb_wrap>ul>li div.dep02{background:#1B91D8;width:100%;opacity:0.9;position:absolute; top:90px; left: 0; z-index: 9900; color:#fff; line-height:1.5; text-align:left;display:none;}
#gnb .gnb_wrap>ul>li div.dep02 a{color:#fff;text-decoration:none; }
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav{float:right; height:217px;width:930px;margin:auto;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav{}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav{width:178px;float:left;padding:20px 0;/*height:217px;*}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li{margin-top:6px;min-height:20px;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li>a{display:block;line-height:20px;font-size:14px;font-weight:bold;color:#fff;text-decoration:none;letter-spacing:-1px;}
#gnb .gnb_wrap>ul>li div.dep02 .sub_nav .sub_rt_nav ul.dep02_nav>li>a:hover{display:block;padding-left:3px;font-weight:bold;color:#8FF3F9;text-decoration:none;}
------------------------------------js---------------------------------
(function(){
sldnavDepth01 = {
_queue : true,
_duration : 338,
sldnav : function(id) {
$nav_slc = $("#"+id+">li");
$displayBox = $("#"+id).parent().parent();
$nav_slc.find(">a").mouseenter(function(){
sldnavDepth01.menu_open($(this));
}).focusin(function() {
$(this).mouseenter();
});
$('a.sldnav_close').focusout(function() {
sldnavDepth01.menu_close($(this));
});
$('a.sldnav_close').click(function() {
sldnavDepth01.menu_close($(this));
return false;
});
$displayBox.mouseleave(function() {
sldnavDepth01.menu_close($(this));
});
},
menu_open : function(e) {
var animatedObj = $(".dep02:animated");
animatedObj.stop();
var fromHeight = $(".dep02:visible").length>0?$(".dep02:visible").height():0;
var toheight = e.next().children(".sub_nav").outerHeight();
$(".dep02").hide();
e.next().css("height", fromHeight +"px");
e.next().show();
$(".gnb_wrap>ul>li").removeClass("on");
$(".gnb_wrap>ul>li").addClass("ov");
$(".gnb_all").addClass("on");
$("#allmenu_wrap").fadeOut( "fast", function() {
$("#allmenu_wrap").css("disply", "none");
});
e.parent().addClass("on");
e.parent().parent().parent().parent().addClass("ov");
e.next().find(".sub_lft_nav").css("height", toheight +"px");
e.next().animate({height: toheight +"px"},{queue: this._queue, duration: this._duration,
complete: function() {}
});
$displayBox.css("height", (toheight + 45) +"px");
},
menu_close : function(e) {
$(".dep02:visible").animate({height: 0},{queue: this._queue, duration: this._duration,
complete: function() {
$(".dep02").hide();
}
});
$(".gnb_wrap>ul>li").removeClass("on");
$(".gnb_wrap>ul>li").removeClass("ov");
$(".gnb_all").removeClass("on");
$("#gnb").removeClass("ov");
$displayBox.css("height", "45px");
}
}
})();
$(document).ready(function() {
$('.dep02').each(function () {
$(this).css("overflow", "hidden");
$(this).children('.sub_nav').height($(this).height());
$(this).find('.sub_lft_nav').height($(this).height());
});
sldnavDepth01.sldnav("gnb_menu");
/*
$("ul.snb_wrap > li").each(function () {
if ($(this).children("a").hasClass("hv") && $(this).children("ul").length > 0 && !$(this).children("ul").hasClass("on")) {
$(this).bind("mouseenter", function () {
$(this).css("overflow", "hidden");
var animatedObj = $("ul.snb_wrap > li:animated");
animatedObj.stop();
animatedObj.height($(this).children("a").outerHeight());
var toHeight = $(this).children("a").outerHeight() + $(this).children("ul").height() +1;
//$(this).children("ul").css("display", "block");
$(this).animate({
height: toHeight +"px"
},
{ queue: true, duration: 300 }
);
});
$(this).children("a").bind("focusin", function () {
$(this).parent().css("overflow", "hidden");
var animatedObj = $("ul.snb_wrap > li:animated");
animatedObj.stop();
animatedObj.height($(this).outerHeight());
var toHeight = $(this).outerHeight() + $(this).parent().children("ul").height() +1;
//$(this).children("ul").css("display", "block");
$(this).parent().animate({
height: toHeight +"px"
},
{ queue: true, duration: 300 }
);
});
$(this).bind("mouseleave", function () {
//$("ul.snb_wrap > li:animated").height(toHeight);
//$("ul.snb_wrap > li:animated").stop();
if ($(this).is(":animated")) {
$(this).stop();
}
var toHeight = $(this).children("a").outerHeight();
$(this).animate({
height: toHeight +"px"
},
{
queue: true,
duration: 100,
complete: function() {
//$(this).children("ul").css("display", "none");
}
}
);
});
}
});*/
if ($('#monthList').length > 0) {
$('#monthList > ul > li').each(function () {
$(this).children("a").bind("focusin", function () {
$('#monthList > ul > li > div').removeClass("calOn");
$(this).next().addClass("calOn");
});
});
}
$(".rt_nav>li.last>a").mouseenter(function(){
$(".slc_lan").css("display","block");
});
$(".rt_nav>li.last").mouseleave(function(){
$(".slc_lan").css("display","none");
});
});
function allmenu_open() {
if ($("#allmenu_wrap:visible").length < 1) {
$("#allmenu_wrap").fadeIn( "fast", function() {
});
$(".dep02").hide();
$(".gnb_wrap>ul>li").removeClass("on");
$(".gnb_wrap>ul>li").removeClass("ov");
$(".gnb_all").removeClass("on");
$("#gnb").removeClass("ov");
}
else {
$("#allmenu_wrap").fadeOut( "fast", function() {
$("#allmenu_wrap").css("disply", "none");
});
}
}