Swiper 쉬운 예제 모음

Swiper 시작하기·다운로드 받기

등록일 :

Swiper 홈페이지

편리하고 강력한 슬라이더 라이브러리 Swiper 입니다.
모바일도 완벽 지원합니다.

이 라이브러리는 jQuery 같은 프레임웍이 없이 단독으로 동작합니다.

추가된 내용
4.5.1 버전이 4 버전대의 마지막 이며
5버전이 새로 등장하였습니다.
5버전 예제는 다시 준비해 보겠습니다. ㄷㄷ

다운로드 받기

이곳에 사용된 버전 v4.5.1

※ 다운로드 링크
zip : https://github.com/nolimits4web/swiper/archive/v4.5.1.zip
tar : https://github.com/nolimits4web/swiper/archive/v4.5.1.tar.gz

다운을 받고 압축을 풀면 많은 파일들이 있습니다.
이 중 필요한 것은 아래 경로의 두개 파일입니다.

CSS 파일 : /dist/css/swiper.min.css
JS 파일 : /dist/js/swiper.min.js

특별한 경우가 아니라면 위 두개의 파일만 복사해서 사용하면 됩니다.

Swiper 를 활용한 사진 슬라이더 예제


- 아래 사진을 좌우로 드래그 해보세요.
- 이런 슬라이더를 쉽게 만들 수 있습니다.
- 4.5.1 버전을 사용하였습니다.
랜덤 사진 갤러리 (새로고침 하면 사진이 바뀝니다)

데모페이지

각종 기본 예제들이 있는 데모페이지 입니다.

이 사이트에서도 예제를 다루고 있습니다.
최대한 쉽고 바로 볼 수 있는 예제를 다루고 있습니다.
하단에 리스트를 참고해 보세요 ^^
※ 예제에 사용한 모든 이미지들은 직접 촬영한 사진입니다.
※ 새로고침하면 사진이 바뀝니다. (이 사이트 기능입니다)
※ 모든 예제들은 계속 조금씩 개선되고 수정됩니다.

방문해 주셔서 감사드립니다. ^^*