목록으로

이전글 다음글

스와이퍼 슬라이더 질문입니다

코딩룰루 3년 전 조회 1,946

답변 1

목록

안녕하세요!

 

스와이퍼 플러그인을 사용해서 슬라이더를 적용했는데

PC 버전에서는 잘 돌아갑니다

근데 반응형 버전에서는 슬라이더가 제자리로 돌아오게 됩니다

어떻게 고치면 될까요?

도와주시면 감사하겠습니다ㅠㅠ

 

--------html---------

       

           

               

VPS PARTNER

           

           

               

http://www.12crowns.com"> src="

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_01.png">

               

http://www.brandmyeliquid.com"> src="

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_02.png">

               

https://www.americanvaporgroup.com/about-ishimoto"> src="

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_03.png">

               

http://www.vapecrown.com/"> src="

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_05.png">

               

https://hustlerjuice.com/"> src="

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_06.png">

               

https://www.doozejuice.com/doozeevent"> src="

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_07.png">

               

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_08.png">

               

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_09.png">

               

" target="_blank" rel="noopener noreferrer">http://vpskorea.com/theme/bs4_v3.0/img/partner_13.png">

-------- javascript ------

window.onload = function() {

    var swiper = new Swiper(".mySwiper", {

        slidesPerView: 3,

        breakpoints : {

            640: {

                slidesPerView: 5

            }

        },

        // 반응형 슬라이더

        spaceBetween: 0,

        slidesPerGroup: 5,

        loopedslides: 1,

        loop: true,

        autoplay: {

            delay: 3000,

            disableOnInteraction: false,

        },

        pagination: {

          el: ".swiper-pagination",

          clickable: true,

        },

        // navigation: {

        //   nextEl: ".swiper-button-next",

        //   prevEl: ".swiper-button-prev",

        // },

      });