swiper 반응형 관련 질문

swiper 반응형 관련 질문

QA

swiper 반응형 관련 질문

본문

안녕하세요 

swiper를 사용하여 반응형 웹사이트를 제작하고있습니다.

근데 pagination이나 next,prev버튼을 모바일일때 사용하고싶어서 애들을 pc일때 display :none하고 

모바일일때 block하게끔 만들었습니다.

 

다만 pc에서 모바일사이즈로 줄어들때 pagination이나 버튼들은 잘 나오는데 동작하지않아서 새로고침하면 또 되더라구요 ㅠ

이거 다른글 찾아보니 

observer: true,

observeParents: true,

이거를 추가하면 된다는데 저는 추가해도 안먹혀서요 ㅠ 이럴땐 어떻게 해야할까요..

 

var swiper = new Swiper(".my-swiper", {

observer: true,

observeParents: true,

slidesPerView: 5,

spaceBetween: 50,

navigation: {

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

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

},

autoplay: {

delay: 2500,

disableOnInteraction: false,

},

breakpoints: {

320: {

slidesPerView: 2,

spaceBetween: 30,

centeredSlides: true,

roundLengths: true,

pagination: {

el: ".cloudData-swiper .swiper-pagination",

type: "fraction",

},

},

1024: {

slidesPerView: 4,

spaceBetween: 40,

},

1450: {

slidesPerView: 5,

spaceBetween: 50,

},

}

});

 

 

이 질문에 댓글 쓰기 :

답변 1

답변을 작성하시기 전에 로그인 해주세요.
전체 93
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT