swiper를 controller로 연동시킬 때 두 개가 서로 묘하게 어긋나면서 돌아가는 오류가 발생했다.

그 때 loopedSlides를 설정해서 오류를 잡았는데 

이 옵션은 loop 시 파라미터의 duplicate 갯수를 설정해준다.

 

뭔지 감이 안 와서 개발자도구를 켜 봤다.

 

loopedSlides를 설정하지 않은 상태

1/3 2/3 3/3 는 내가 설정한 슬라이드, 그리고 앞 뒤로 duplicate 즉 복제된 슬라이드가 하나씩 있다.

여기까진 평범하게 빙빙 돌아가는 슬라이드의 모습이다. 

 

 

loopedSlides: 3 설정했을 때

 

1/3 2/3 3/3이 앞 뒤로 복제됐다.

 

 

그러니까 두 개의 스와이퍼 연동 시 오류가 발생했을 때 

각각의 스와이퍼의 duplicate 된 갯수가 일치하는지 확인해보고 맞지 않는다면 loopedSlides를 설정해 맞춰줬더니 

서로 잘 맞물려서 돌아갔다.

+ Recent posts