티스토리 뷰

WEB/JQuery

[이미지 슬라이드 jQuery] owlcarousel

silverline79 silverline79 2021. 5. 6. 06:00

[이미지 슬라이드 jQuery] owlcarousel

JS

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
$('.owl-carousel').owlCarousel({
    loop:true,
    margin:10,
    nav:true,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:3
        },
        1000:{
            items:5
        }
    }
})
cs

 

HTML

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="owl-carousel owl-theme">
    <div class="item"><h4>1</h4></div>
    <div class="item"><h4>2</h4></div>
    <div class="item"><h4>3</h4></div>
    <div class="item"><h4>4</h4></div>
    <div class="item"><h4>5</h4></div>
    <div class="item"><h4>6</h4></div>
    <div class="item"><h4>7</h4></div>
    <div class="item"><h4>8</h4></div>
    <div class="item"><h4>9</h4></div>
    <div class="item"><h4>10</h4></div>
    <div class="item"><h4>11</h4></div>
    <div class="item"><h4>12</h4></div>
</div>
cs

 

owlcarousel2.github.io/OwlCarousel2/demos/demos.html

 

Demos | Owl Carousel | 2.3.4

 

owlcarousel2.github.io

owlcarousel2.github.io/OwlCarousel2/

 

Home | Owl Carousel | 2.3.4

Modules and Plugins Owl Carousel supports plugin modular structure. Therefore, you can detach plugins that you won't use on your project or create new ones that fit your needs

owlcarousel2.github.io

OwlCarousel2-2.3.4.zip
0.76MB

댓글
댓글쓰기 폼
공지사항
최근에 달린 댓글
Total
3,163
Today
0
Yesterday
6
링크
TAG more
«   2021/09   »
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    
글 보관함