tolag3/koipa_edu_2025-1
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'subsub' into advc

Browse Source
This commit is contained in:
subsub 2023-10-12 12:42:56 +09:00
commit 39bd477787
2 changed files with 21 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/main/webapp/visitEdu/usr/publish/css/common.css
View File

@ -10,8 +10,8 @@ body {color: #222;}
.logo img {width: 200px;} .logo img {width: 200px;}
/* header */ /* header */
header{width: 100%; height: 130px; position: fixed; top: 0; left: 0; transition: height .4s ease-in-out, background-color .4s ease-in-out, margin .4s ease-in-out; overflow: hidden; box-sizing: border-box;z-index: 20; background-color: #fff;} header{width: 100%; height: 130px; position: fixed; top: 0; left: 0; transition: height .4s ease-in-out, background-color .4s ease-in-out, margin .4s ease-in-out; overflow: hidden; box-sizing: border-box;z-index: 20; background-color: #fff; border-bottom: 1px solid #e2e4e6;max-height: 350px;}
header.on{background-color: #fff; box-shadow: 0 3px 10px rgba(0,0,0,0.1);} header.on{background-color: #fff; box-shadow: 0 3px 10px rgba(0,0,0,0.1); max-height: 350px;}
header::before{position: absolute; content: " "; display: block; top: 130px; left: 0; height: 1px; background-color: #ddd; opacity: 0; transition: opacity .4s ease-in-out;} header::before{position: absolute; content: " "; display: block; top: 130px; left: 0; height: 1px; background-color: #ddd; opacity: 0; transition: opacity .4s ease-in-out;}
header::after{position: absolute; content: " "; display: block; width: 100%; height: 1px; background-color: #d5d5d5; top: 130px; left: 0; opacity: 0; transition: opacity .4s ease-in-out;} header::after{position: absolute; content: " "; display: block; width: 100%; height: 1px; background-color: #d5d5d5; top: 130px; left: 0; opacity: 0; transition: opacity .4s ease-in-out;}
header.on::after{top: 130px; opacity: 1;} header.on::after{top: 130px; opacity: 1;}
@ -54,20 +54,22 @@ header.scroll{box-shadow: 0 5px 8px rgba(0,0,0,0.15);}
.header_inner .depth01 {display: flex; height: 100%;} .header_inner .depth01 {display: flex; height: 100%;}
.header_inner .dep_li_01,.header_inner .dep_li_02,.header_inner .dep_li_03 {justify-content:flex-start;} .header_inner .dep_li_01,.header_inner .dep_li_02,.header_inner .dep_li_03 {justify-content:flex-start;}
.header_inner .dep_li_04,.header_inner .dep_li_05,.header_inner .dep_li_06,.header_inner .dep_li_07 {justify-content:space-between;} .header_inner .dep_li_04,.header_inner .dep_li_05,.header_inner .dep_li_06,.header_inner .dep_li_07 {justify-content:space-between;}
.header_inner .depth01_li{position: relative; padding: 0; box-sizing: border-box;} .header_inner .depth01_li{position: relative; height:100%; padding: 0; box-sizing: border-box;}
.header_inner .dep_li_04 .depth01_li{width: calc((100% - 40px)/4);} .header_inner .dep_li_04 .depth01_li{width: calc((100% - 40px)/4);}
.header_inner .dep_li_01 .depth01_li{width: 100%;} .header_inner .dep_li_01 .depth01_li{width: 100%;}
.header_inner .dep_li_02 .depth01_li{width: calc((100% - 20px)/2);} .header_inner .dep_li_02 .depth01_li{width: calc((100% - 20px)/2);}
.header_inner .dep_li_03 .depth01_li{width: calc((100% - 30px)/3);max-width:270px;} .header_inner .dep_li_03 .depth01_li{width: calc((100% - 30px)/3);max-width:270px;}
.header_inner .dep_li_05 .depth01_li{width: calc(100%/5);} .header_inner .dep_li_05 .depth01_li{width: calc(100%/5);}
.header_inner .dep_li_06 .depth01_li{width: calc((100% - 60px)/6);} .header_inner .dep_li_06 .depth01_li{width: calc((100% - 60px)/6);}
.header_inner .dep_li_07 .depth01_li{width: auto;} .header_inner .dep_li_07 .depth01_li:nth-child(n+2):nth-child(-n+4){width: 16%;}
.header_inner .menu_link{font-size: 20px; font-weight: 600; letter-spacing: -0.5px; display: flex; align-items: center; justify-content: center; flex-flow: column; height: 100%; position: relative;font-family: 'nanumsquare', 'Noto Sans KR', sans-serif; line-height: 1.25;} .header_inner .dep_li_07 .depth01_li:nth-child(n+5){width: 12%; min-width: 85px;}
.header_inner .dep_li_07 .depth01_li:nth-child(1),.header_inner .dep_li_07 .depth01_li:nth-child(2){width:170px;}
.header_inner .menu_link{font-size: 18px; font-weight: 600; letter-spacing: -0.5px; display: flex; align-items: center; justify-content: center; flex-flow: column; height: 100%; position: relative;font-family: 'nanumsquare', 'Noto Sans KR', sans-serif; line-height: 1.25;}
.header_inner .menu_link::before{position: absolute; content: " "; display: block; width: 0; height: 4px; background-color: #E95504; left: 50%; transform: translateX(-50%); transition: width .4s ease-in-out; top: 87px; z-index: 1;} .header_inner .menu_link::before{position: absolute; content: " "; display: block; width: 0; height: 4px; background-color: #E95504; left: 50%; transform: translateX(-50%); transition: width .4s ease-in-out; top: 87px; z-index: 1;}
.header_inner .menu_link .menu_link_br {color: #E95504;font-family: 'nanumsquare', 'Noto Sans KR', sans-serif; } .header_inner .menu_link .menu_link_br {color: #E95504;font-family: 'nanumsquare', 'Noto Sans KR', sans-serif; }
.header_inner .on .menu_link{color: #E95504;} .header_inner .on .menu_link{color: #E95504;}
.on .nav_wrap .on .menu_link::before{width: 100%;} .on .nav_wrap .on .menu_link::before{width: 100%;}
.header_inner .depth02{position: absolute; text-align: center; padding: 15px 0; width: 100%; left: 50%; transform: translateX(-50%);border-right: 1px solid #d5d5d5;} .header_inner .depth02{position: absolute; text-align: center; padding: 15px 0; width: 100%; left: 50%; transform: translateX(-50%);border-right: 1px solid #d5d5d5; max-height: 350px;}
.header_inner .depth01_li:first-child .depth02{border-left: 1px solid #d5d5d5;} .header_inner .depth01_li:first-child .depth02{border-left: 1px solid #d5d5d5;}
.header_inner .depth01_li:hover .depth02::after{position:absolute;content:"";width:calc(100% + 4px);height:100%;background-color:#fff8f4;left:-2px;top:0;} .header_inner .depth01_li:hover .depth02::after{position:absolute;content:"";width:calc(100% + 4px);height:100%;background-color:#fff8f4;left:-2px;top:0;}
.header_inner .depth01_li:hover .depth02 li{position:relative;z-index:1;} .header_inner .depth01_li:hover .depth02 li{position:relative;z-index:1;}

19
src/main/webapp/visitEdu/usr/publish/script/common.js
View File

@ -159,16 +159,23 @@ function header() {
function open_gnb(item) { function open_gnb(item) {
var depth01 = item; var depth01 = item;
var depth01_li = depth01.closest(".depth01_li"); var depth01_li = depth01.closest(".depth01_li");
var depth02 = depth01_li.find(".depth02");
var height_array = gnb.find('.depth02').map(function(){ var height_array = gnb.find('.depth02').map(function(){
return $(this).outerHeight(); return $(this).outerHeight();
}); });
if($("body").hasClass("renewal") == true){
var h=Math.max.apply(Math, height_array)+130; var h = Math.max.apply(Math, height_array)+150;
//console.log(height_array,Math.max.apply(Math, height_array)+150);
if(h+1>=Math.max.apply(Math, height_array)){
h;
header.addClass("on").css('height',h + 'px');
$("header .depth02").css('height',h+'px');
//console.log("1");
}else{ }else{
var h=Math.max.apply(Math, height_array)+180; header.addClass("on").css('height',h + 'px');
$("header .depth02").css('height',h+'px');
//console.log("2");
} }
header.addClass("on").css('height',h + 'px');
depth01_li.addClass("on"); depth01_li.addClass("on");
} }
@ -197,6 +204,7 @@ function header() {
header.on("mouseleave", function () { header.on("mouseleave", function () {
header.removeClass("on").attr('style',''); header.removeClass("on").attr('style','');
$(".depth01_li").removeClass("on"); $(".depth01_li").removeClass("on");
$("header .depth02").animate({height:'auto'},1000);
}); });
$("#menu .depth01_li:last-child .depth02 li:last-child").on("focusout", function () { $("#menu .depth01_li:last-child .depth02 li:last-child").on("focusout", function () {
@ -283,7 +291,6 @@ function gnbOpen() {
var depth = target.find('.gnb .depth01'); var depth = target.find('.gnb .depth01');
var h = target.find('.gnb').outerHeight() - 60; var h = target.find('.gnb').outerHeight() - 60;
h += 178; h += 178;
function gnbActive() { function gnbActive() {
target.addClass('active').css('height', h + 'px'); target.addClass('active').css('height', h + 'px');