From ddd3fd88e99eb051ac228c73c21a47cca9641bcd Mon Sep 17 00:00:00 2001 From: com02 Date: Mon, 29 Nov 2021 19:04:53 +0900 Subject: [PATCH] =?UTF-8?q?=EC=8A=AC=EB=9D=BC=EC=9D=B4=EB=93=9C=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp | 79 +++++++++++++------ .../jsp/nlib/collection/searchItemDetail.jsp | 69 ++++++++++------ src/main/webapp/css/default.css | 8 +- src/main/webapp/css/media.css | 14 ++-- 4 files changed, 112 insertions(+), 58 deletions(-) diff --git a/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp b/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp index 92cdd889..9e1c0de8 100644 --- a/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp +++ b/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp @@ -440,8 +440,9 @@ function fn_listPops(typeDivCd) { _spaceBetween = 20; } + /* 문화원s pick */ - var swiper = new Swiper(".pickSwiper", { + var swiper = new Swiper('.pickSwiper', { loop : true, slidesPerView : _slidesPerView, spaceBetween : _spaceBetween, @@ -454,27 +455,26 @@ function fn_listPops(typeDivCd) { nextEl : ".swiper-button-next", prevEl : ".swiper-button-prev", }, - /* - pagination: { - el: ".swiper-pagination", - clickable: true, - }, - */ - }); - - /* 인기자료 */ - var swiper = new Swiper(".popularSwiper", { - loop: true, - slidesPerView : _slidesPerViewpopula, - spaceBetween : _spaceBetween, - centeredSlides : false, - pagination : { - el : ".swiper-pagination", + /* + pagination: { + el: ".swiper-pagination", + clickable: true, }, + */ + on: { + init: function () { + if (this.slides.length <= 5) { + // First way: + this.allowSlidePrev = this.allowSlideNext = false; // disabling swiping + this.el.querySelector(".swiper-button-prev").style.visibility = "hidden"; // hiding arrows prev&next + this.el.querySelector(".swiper-button-next").style.visibility = "hidden"; + } + } + } }); - + /* 온라인 자료관 */ - var swiper = new Swiper(".onlineSwiper", { + var swiper = new Swiper('.onlineSwiper', { loop : true, slidesPerView : _slidesPerViewOnline, spaceBetween : _spaceBetween, @@ -487,12 +487,41 @@ function fn_listPops(typeDivCd) { nextEl : ".swiper-button-next", prevEl : ".swiper-button-prev", }, - /* - pagination: { - el: ".swiper-pagination", - clickable: true, - }, - */ + on: { + init: function () { + if (this.slides.length <= 5) { + // First way: + this.allowSlidePrev = this.allowSlideNext = false; // disabling swiping + this.el.querySelector(".swiper-button-prev").style.visibility = "hidden"; // hiding arrows prev&next + this.el.querySelector(".swiper-button-next").style.visibility = "hidden"; + } + } + } + }); + + /* 인기자료 */ + var swiper = new Swiper('.popularSwiper', { + loop: true, + slidesPerView : _slidesPerViewpopula, + spaceBetween : _spaceBetween, + autoplay : { + delay : 2500, + disableOnInteraction : false, + }, + centeredSlides : false, + pagination : { + el : ".swiper-pagination", + }, + on: { + init: function () { + if (this.slides.length <= 5) { + // First way: + this.allowSlidePrev = this.allowSlideNext = false; // disabling swiping + this.el.querySelector(".swiper-button-prev").style.visibility = "hidden"; // hiding arrows prev&next + this.el.querySelector(".swiper-button-next").style.visibility = "hidden"; + } + } + } }); diff --git a/src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp b/src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp index 8271ea0a..578f96f6 100644 --- a/src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp +++ b/src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp @@ -398,9 +398,10 @@ function goList(){ if (windowWidth < 480) { _slidesPerView = 1; } + /* 함께 볼만한자료 슬라이드 */ - var swiper = new Swiper(".DetailSwiper1", { - loop: true, + var swiper = new Swiper('.DetailSwiper1', { + loop: false, slidesPerView: _slidesPerView, spaceBetween: 30, centeredSlides: false, @@ -418,7 +419,17 @@ function goList(){ clickable: true, }, */ - }); + on: { + init: function () { + if (this.slides.length <= 5) { + // First way: + this.allowSlidePrev = this.allowSlideNext = false; // disabling swiping + this.el.querySelector(".swiper-button-prev").style.visibility = "hidden"; // hiding arrows prev&next + this.el.querySelector(".swiper-button-next").style.visibility = "hidden"; + } + } + } + }); var _slidesPerViewBottom = 5; var _spaceBetween = 30; @@ -426,25 +437,37 @@ function goList(){ _slidesPerViewBottom = 1.5; _spaceBetween = 20; } + /* 유사한 자료 슬라이드 */ - var swiper = new Swiper(".DetailSwiper2", { - loop: true, - slidesPerView: _slidesPerViewBottom, - spaceBetween: _spaceBetween, - centeredSlides: true, - autoplay: { - delay: 1112500, - disableOnInteraction: false, - }, - navigation: { - nextEl: ".swiper-button-next", - prevEl: ".swiper-button-prev", - }, - /* - pagination: { - el: ".swiper-pagination", - clickable: true, - }, - */ - }); + var swiper = new Swiper('.DetailSwiper2', { + loop: true, + slidesPerView: _slidesPerViewBottom, + spaceBetween: _spaceBetween, + centeredSlides: true, + autoplay: { + delay: 2500, + disableOnInteraction: false, + }, + navigation: { + nextEl: ".swiper-button-next", + prevEl: ".swiper-button-prev", + }, + /* + pagination: { + el: ".swiper-pagination", + clickable: true, + }, + */ + on: { + init: function () { + if (this.slides.length <= 5) { + // First way: + this.allowSlidePrev = this.allowSlideNext = false; // disabling swiping + this.el.querySelector(".swiper-button-prev").style.visibility = "hidden"; // hiding arrows prev&next + this.el.querySelector(".swiper-button-next").style.visibility = "hidden"; + } + } + } + }); + \ No newline at end of file diff --git a/src/main/webapp/css/default.css b/src/main/webapp/css/default.css index 925abfdc..8cf0b698 100644 --- a/src/main/webapp/css/default.css +++ b/src/main/webapp/css/default.css @@ -509,7 +509,7 @@ transform: rotate(45deg); .join .inner .row-bottom .join-box .form-group.Usermobile .con .row .timer {display: inline-block;width:15px;height:15px;position: absolute;top:8px;right:350px;z-index: 99;color:red;display:none;} .join .inner .row-bottom .join-box .form-group .con span.fail {width:26%;font-size:12px;display: inline-block;margin:0px 0px 0px 10px;vertical-align: middle;color:red;display: none;} -.join .inner .row-bottom .join-box .form-group.Userbirth .con label {display:inline !important;position:absolute;z-index:-1;} +.join .inner .row-bottom .join-box .form-group.Userbirth .con label {display:inline !important;position:absolute;z-index:-1;opacity:0;} .join .inner .row-bottom .join-box .form-group.Usermobile .con label[for="mobileNo_1"], .join .inner .row-bottom .join-box .form-group.Usermobile .con label[for="mobileNo_2"], .join .inner .row-bottom .join-box .form-group.Usermobile .con label[for="mobileNo_3"] {display:inline !important;position:absolute;z-index:-1;} @@ -1707,7 +1707,7 @@ transform: rotate(45deg); .pop-login-connect .inner .First .Btn button span:nth-of-type(1) {border-right:1px solid #ddd;margin-right:10px;padding-right:10px;} .pop-login-connect .inner .First .Btn button:hover {border:1px solid #4a7ba6;} .pop-login-connect .inner .First .Btn button:hover span {color:#222;} -.pop-login-connect .inner .btn {width:70%;padding:20px 15% 0px;} +.pop-login-connect .inner .btn {width:68%;padding:20px 15% 0px;} .pop-login-connect .inner .btn p .cancel {color:#999;width:100%;display:inline;font-size:12px;font-weight: 300;border-bottom: 1px solid #ddd;padding:3px 3px;} .pop-login-connect .inner .login-close {position: absolute;right: 20px;top: 20px;width: 26px;height: 26px;text-indent: 9999px;font-size: 0;overflow: hidden;background: url(/images/btn/btn_close_size_27x26_c9c9c7.png) no-repeat;background-size: 100%;} .pop-login-connect .Bg {width:100%;height:100%;position:fixed;top:0px;left:0px;background:rgba(0,0,0,0.5);z-index:-1;} @@ -1755,13 +1755,13 @@ transform: rotate(45deg); /* 반려사유 팝업 */ -.pop-return {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: 60%;border-radius: 5px;overflow: hidden;padding: 0 0px;background: #fff;z-index:999;} +.pop-return {position:fixed;top:9%;left:calc(50% - 210px);width: 420px;height: 55%;border-radius: 5px;overflow: hidden;padding: 0 0px;background: #fff;z-index:999;} .pop-return .inner {display:inline-block;width:100%;height: calc(100% - 270px);overflow:auto;padding:50px 0px;background: #fff;} .pop-return .inner .row {padding:0px 30px 0px;text-align:center;} .pop-return .Title {text-align:center;padding:30px 0px;background: url(/images/bg/bg-login.jpg) no-repeat;background-size:cover;} .pop-return .Title h3 {font-size:24px;line-height:30px;margin-top:15px;color:#fff;font-weight: 300;} .pop-return .Title p {font-size:16px;line-height:16px;color:#fff;} -.pop-return .inner .Text .text-box {color:#666;background: #f8f8f8;border:1px solid #ddd;border-radius:3px;padding:20px;font-size:14px;height:80px;text-align: left;margin-bottom:40px;} +.pop-return .inner .Text .text-box {overflow:auto;color:#666;background: #f8f8f8;border:1px solid #ddd;border-radius:3px;padding:20px;font-size:14px;height:80px;text-align: left;margin-bottom:40px;} .pop-return .inner .btn {width:70%;padding:20px 15% 40px;line-height: normal} .pop-return .inner .btn-box .btn {width:auto;padding:10px 25px;} .pop-return .inner .btn p .cancel {color:#999;width:100%;display:inline;font-size:12px;font-weight: 300;border-bottom: 1px solid #ddd;padding:3px 3px;} diff --git a/src/main/webapp/css/media.css b/src/main/webapp/css/media.css index 9d7a941b..3d03d6ec 100644 --- a/src/main/webapp/css/media.css +++ b/src/main/webapp/css/media.css @@ -195,7 +195,7 @@ footer .family_site {right:10px;} .pop-serge {width:700px;left:calc(50% - 350px);} .data.detail .inner .row-top {padding:45px 2%;width:96%;} .data.detail .inner .row-top .center .left {margin-right:6%;} -.data.detail .inner .row-bottom .con-1 .list-box .list {width:24.5%;} +.data.detail .inner .row-bottom .con-1 .list-box .list {width:24.5%;min-height:150px;} .list-table-wrap li .t-date {width:20%;} .list-table-wrap li .t-writer {width:25%;} .list-search .left {width:50%;} @@ -802,7 +802,7 @@ footer .family_site {right:10px;} .view-con .view-txt p img {width:100% !important;height:auto !important;} /*.view-con .view-txt * {width:100% !important;height:auto !important;display:inline-block;}*/ .noti-data .btn-box a { width: 100%; box-sizing: border-box; font-size: 14px; font-weight: normal; } - .list-table-wrap li .t-writer {width: 55px !important;height: 15px !important;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;} + .list-table-wrap li .t-writer {width: auto !important;height: 15px !important;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;text-align:left;} .community-write fieldset {border-top:0;} /* faq */ @@ -863,7 +863,7 @@ footer .family_site {right:10px;} .qna .list-table-wrap li .t-date, .qna .list-table-wrap li .t-answer { width: auto; } .qna .list-table-wrap li .t-writer, - .qna .list-table-wrap li .t-date { margin-right: 10px; padding-right: 10px; border-right: 1px solid #ccc; line-height: 1; } + .qna .list-table-wrap li .t-date { margin-right: 10px; padding-right: 10px; border-right: 1px solid #ccc; line-height: 1;text-align:left;width:auto !important; } .qna .btn-box, .qna .btn-box .btn { width: 100%; } @@ -1096,7 +1096,9 @@ footer .family_site {right:10px;} .pop-login .inner .First .Btn button { font-weight: normal; font-size: 15px; } .pop-login .inner .Text { width: 100%; padding: 56px 0 0; } .pop-login .inner .mo-pop-Title { display: block; } - + + .pop-find .inner {height: calc(100% - -60px);} + /* 상세검색 팝업 */ .popup.pop-advanced-search .pop-wrap { width: 100vw; height: 100vh; border-radius: 0; } .pop-advanced-search .pop-wrap .Title { padding: 0 16px; box-sizing: border-box; width: 100%; } @@ -1160,9 +1162,9 @@ footer .family_site {right:10px;} .pop-login-connect .Title p, .pop-login-connect .Title h3, .pop-login-password .Title p, - .pop-login-password .Title h3 { display: none; } + .pop-login-password .Title h3 { } .pop-login-connect .inner, - .pop-login-password .inner { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; box-sizing: border-box; padding: 60px 16px; } + .pop-login-password .inner { height: calc(100% - 75px);display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; box-sizing: border-box; padding: 60px 16px; } .pop-login-connect .inner .row, .pop-login-password .inner .row { padding: 0; width: 100%; } .pop-login-connect .inner h3.row,