Carousels
Touch enabled jQuery plugin that lets you create a beautiful responsive carousel slider.
Example
<div class="owl-carousel" data-margin="30" data-nav="true">
<figure class="photo">
<a class="lightbox" href="../../assets/images/image-1.jpg" title="Image title">
<img src="../../assets/images/image-1.jpg" alt="Image">
</a>
</figure>
<figure class="photo">
<a class="lightbox" href="../../assets/images/image-1.jpg" title="Image title">
<img src="../../assets/images/image-1.jpg" alt="Image">
</a>
</figure>
<figure class="photo">
<a class="lightbox" href="../../assets/images/image-1.jpg" title="Image title">
<img src="../../assets/images/image-1.jpg" alt="Image">
</a>
</figure>
</div>data-items="[3,2,1]" |
Number of slides per viewport: [large,medium,small] |
|---|---|
data-margin="10" |
Spacing between slides in pixels |
data-center="true" |
Center slides |
data-nav="true" |
Enable carousel navigation |
data-dots="true" |
Enable carousel pagination |
data-autoplay="true" |
Enable carousel autoplay |
data-loop="true" |
Duplicate last and first items to get loop illusion. |
data-autoheight="true" |
Elements with different height will change smoothly |