<plugin> Owl Carousel2 (1) 시작하기

2017. 8. 25. 18:44

Owl Carousel : 슬라이드 플러그인

https://owlcarousel2.github.io/OwlCarousel2/

사용하기

1. 홈페이지 접속

https://owlcarousel2.github.io/OwlCarousel2/

2. 다운로드

- 다운로드된 폴더

필요한 파일들을 모아서 정리하기.

-> docs로 들어가기

-> asset

-> owlcarousel

-> js파일 복사해서 원하는 폴더에 넣기

-> assets

-> css, theme.css 파일 외에 원하는 것 골라 파일에 넣기.

3.파일 연결하기

-Docs

- Installation

- 아래의 내용 따라서 파일 연결하면 된다.

4. HTML, CSS 설정하기 , owl-carousel 실행

아래의 내용 따라 HTML, CSS 설정, owl-carousel 불러온다.

<HTML>

버튼 테그를 추가하고 원하는 형태로 변형시켰다.

<CSS>

-> 여기까지는 화면에 CSS 가 나타나지 않는다 ( class 가 owl-carousel인 태그)

- owlCarousel 함수 실행

커서로 드래그 하면 옆으로 돌아가는 슬라이드.

공부기록