어쩌다 알게 된 ƪ(•̃͡•̃͡ ƪ

( owlCarousel ) 플러그인 달기 본문

플러그인, 라이브러리/플러그인

( owlCarousel ) 플러그인 달기

비니_ 2021. 6. 11. 12:20
728x90

<html>

<div id="hb" class="owl-carousel">
  <div> Your Content </div>
  <div> Your Content </div>
  <div> Your Content </div>
</div>

 

<js>

//owl
jQuery("#hb").owlCarousel({
				loop:true,
				margin:0,
				nav:true,
       			items:1,
        		autoplay:true,
				responsive:{ //반응형에 따른 스타일 옵션
					0:{
						items:1, // 모바일
					},
					600:{
						items:1, // 브라우저 600px 이하
            nav:false,
					},
					1024:{
						items:1, // 브라우저 1024px 이하
					}
				}
			});

 

 

 

옵션 참고

 

 

https://owlcarousel2.github.io/OwlCarousel2/docs/api-options.html

 

Options | Owl Carousel | 2.3.4

Options List including all options from built-in plugins video, lazyload, autoheight and animate. items Type: Number Default: 3 The number of items you want to see on the screen. margin Type: Number Default: 0 margin-right(px) on item. loop Type: Boolean D

owlcarousel2.github.io

 

728x90

'플러그인, 라이브러리 > 플러그인' 카테고리의 다른 글

[GSAP] ScrollTrigger 기본 사용법  (0) 2025.03.26
[GSAP] Tween  (0) 2025.01.14
[GSAP] ScrollTrigger  (0) 2025.01.14
( slick slide ) 옵션 정리 / 예제 링크  (4) 2021.06.12
( slick slider ) 플러그인 달기  (4) 2021.06.11
'플러그인, 라이브러리/플러그인' Related Articles more
Comments