swiper 수정

src/main/webapp/META-INF/maven/nlib/nlib/pom.properties

@@ -1,5 +1,5 @@
 #Generated by Maven Integration for Eclipse
-#Thu Dec 09 09:34:33 KST 2021
+#Tue Dec 14 09:54:36 KST 2021
 version=1.0.0
 groupId=nlib
 m2e.projectName=iams.nlib

src/main/webapp/META-INF/maven/nlib/nlib/pom.xml

@@ -21,7 +21,7 @@
         <egovframework.rte.version>3.8.0</egovframework.rte.version>
         <spring-security.version>4.2.5.RELEASE</spring-security.version>
         <slf4j.version>1.7.2</slf4j.version> 
-        <log4j.version>2.11.0</log4j.version>
+        <log4j.version>2.15.0</log4j.version>
     </properties>
 
     <repositories>

src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp

@@ -463,7 +463,6 @@ $(function(){
     var _centeredSlides = false;
     var _loop = false;
     
-
     if (windowWidth <= 768) {
        _loop = false;
        _slidesPerView = 1;
@@ -495,8 +494,8 @@ $(function(){
    /* 문화원s pick */
    var pickswiper = new Swiper('.pickSwiper', {
       loop : _loop,
-      slidesPerView : _slidesPerView,
+      slidesPerView : 5,
-      spaceBetween : _spaceBetween,
+      spaceBetween : 30,
       centeredSlides : _centeredSlides,
       autoplay : false,
       navigation : {
@@ -507,6 +506,20 @@ $(function(){
           el: '.pagination .swiper-pagination',
           type: 'fraction',
        },
+       breakpoints: {
+           768: {
+        	    slidesPerView : 1,
+        	    spaceBetween : 20,
+           },
+           1400: {
+	    	    slidesPerView : 3,
+	    	    spaceBetween : 30,
+           },
+           4989: {
+	    	    slidesPerView : 5,
+	    	    spaceBetween : 30,
+           }
+       },
        on: {
            init: function () {
                if (this.slides.length <= _lenght) {
@@ -535,6 +548,20 @@ $(function(){
           el: '.pagination .swiper-pagination',
           type: 'fraction',
        },
+       breakpoints: {
+           768: {
+        		slidesPerView : 1,
+        		spaceBetween : 20,
+           },
+           1400: {
+	       		slidesPerView : 3,
+	    	    spaceBetween : 30,
+           },
+           4989: {
+	       		slidesPerView : 7,
+	    	    spaceBetween : 30,
+           }
+       },
        on: {
            init: function () {
                if (this.slides.length <= _lenght) {
@@ -559,6 +586,20 @@ $(function(){
           el: '.pagination .swiper-pagination',
           type: 'fraction',
        },
+       breakpoints: {
+           768: {
+        		slidesPerView : 1,
+        	    spaceBetween : 20,
+           },
+           1400: {
+	       		slidesPerView : 2,
+	    	    spaceBetween : 30,
+           },
+           4989: {
+	       		slidesPerView : 4,
+	    	    spaceBetween : 30,
+           }
+       },
        on: {
            init: function () {
                if (this.slides.length <= _lenght) {

src/main/webapp/WEB-INF/jsp/nlib/collection/searchItemDetail.jsp

@@ -576,6 +576,23 @@ $(function(){
           el: '.pagination .swiper-pagination',
           type: 'fraction',
        },
+       breakpoints: {
+           768: {
+        		loop : _loop,
+        		slidesPerView : 1,
+        	    spaceBetween : 20,
+           },
+           1400: {
+	       		loop : _loop,
+	       		slidesPerView : 3,
+	    	    spaceBetween : 30,
+           },
+           4989: {
+	       		loop : _loop,
+	       		slidesPerView : 4,
+	    	    spaceBetween : 30,
+           }
+       },
       on: {
           init: function () {
               if (this.slides.length <= _lenght) {
@@ -604,6 +621,21 @@ $(function(){
          el: '.pagination .swiper-pagination',
          type: 'fraction',
       },
+      breakpoints: {
+          768: {
+       		slidesPerView : 1,
+       	    spaceBetween : 20,
+          },
+          1400: {
+	       		slidesPerView : 3,
+	    	    spaceBetween : 30,
+          },
+          4989: {
+	       		loop : _loop,
+	       		slidesPerView : 5,
+	    	    spaceBetween : 30,
+          }
+      },
      on: {
          init: function () {
              if (this.slides.length <= _lenght) {

src/main/webapp/css/default.css

@@ -329,8 +329,8 @@ transition: all 0.2s ease-in-out;
 .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box .RIS {float:left;width:35%;}
 .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box .view a {background: #376795;color:#fff;display: block;border-radius: 3px;padding:8px 0px;font-size: 14px;}
 .sec6 .onlineSwiper .items .List .inner div.thumbnail div.detail-cover .btn-box .RIS a {background: #666;color:#fff;display: block;border-radius: 3px;padding:8px 0px;font-size: 14px;}
-.sec6 .swiper-button-next, .swiper-rtl .swiper-button-prev {right:30px;}
+.sec6 .swiper-button-next, .swiper-rtl .swiper-button-prev {right:30px;top:45%;}
-.sec6 .swiper-button-prev, .swiper-rtl .swiper-button-next {left:30px;}
+.sec6 .swiper-button-prev, .swiper-rtl .swiper-button-next {left:30px;top:45%;}
 .sec6 .onlineSwiper .loop-count {display: inline-block;position:relative;top:50%;width:36px;height:36px;padding:2px;vertical-align: middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
 .sec6 .onlineSwiper .loop-count button.remote-online {background:none !important;position:absolute;left:0;right:0;top:0;bottom:0;width:20px;height:20px;margin:auto;border:2px solid #333;border-radius:50%;z-index:1;background-size:34px 34px;}
 .sec6 .onlineSwiper .loop-count button.remote-online span {display:block;width:100%;height:100%;background:transparent url('/images/btn/btn-mainvisual-stop-black.png') no-repeat 50% 50%;}