CODE CAVE

웹 프론트엔드 작업을 하다보면 스와이퍼를 구현해야할 일이 많습니다.이 중 가장 많이 쓰이는 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;..

이번에 소개 해드릴 것은 swiper 라는 라이브러리 인데요~ 간단하게 이미지 슬라이더를 구현 할 수 있는데 여기에 터치 스와이프 까지 지원해서 모바일에서 쓰기에도 매우 적합하다고 보여집니다~ 저도 실제로 한개의 데스크탑 슬라이드와 한개의 모바일 웹 사이트에 적용해봤는데 매우 자연스럽고 확장성도 좋았습니다. 공식 사이트는 여기 이구요. 스와이프 라이브러리 사용법은 아래와 같습니다. new Swiper('.container', { pagination: '.swiper-pagination', paginationClickable: true, spaceBetween:0, loop: true, }); 위 처럼 작성 해주시면 자바스크립트 쪽은 끝 입니다. 매우 직관적이죠? 객체를 생성하면서 생성자에 인수를 넘기는 ..