[JS] Swiper - 자동 슬라이드, 반복, 콜백 ...

웹 프론트엔드 작업을 하다보면 스와이퍼를 구현해야할 일이 많습니다.

이 중 가장 많이 쓰이는 Swiper 라이브러리 사용법을 간단히 소개드립니다.

Swiper 라이브러리에는 다양한 속성들이 있는데 자주 쓰이는 속성들만 모아보았습니다.

new Swiper('.container', {
    pagination: '.swiper-pagination',
    paginationClickable: true,
    spaceBetween:0,
    autoplay: 3000,
    autoplayDisableOnInteraction: false,
    loop: true,
    onSlideChangeEnd: function (swiper) {
        var swiper.activeIndex;
        var slidesLen = swiper.slides.length;
        
    }
});

- loop: 슬라이드 계속 반

- autoplay: 3초 마다 자동 슬라이드

- onSlideChangeEnd : 슬라이드가 바뀔 때마다 호출되는 콜백함수

이 정도 매개변수 들만 기억하고 있으면 왠만한건 다 구현이 가능하더라구요.

참고가 되셨으면 좋겠습니다.