Joydev Pal
Joydev Pal

Reputation: 303

owl carousel activator div class name

$(document).ready(function() {
    $('.owl-carousel').owlCarousel({
        margin: 10,
        nav: true,
        loop: true,
        responsive: {
            0: {
                items: 1
            },
            600: {
                items: 3
            },
            1000: {
                items: 5
            }
        }
    })
});

The above code is working fine. But when I change the class named owl-carousel, it is not working. My question is why it's not working with any other class. Is it required to keep the class name owl-carousel.

Thanks.

Upvotes: 1

Views: 1840

Answers (2)

DayDreamer
DayDreamer

Reputation: 116

Because the basic demo of the carousel make confusing, it should be.

<div class="carousel-one 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>

and js

$('.carousel-one').owlCarousel({ 
    items: 3,
    loop: true, 
    dots: true, 
});

Upvotes: 0

Monique
Monique

Reputation: 31

You should add owl-carousel class to the element in all cases, ex:

<div class="your-own-class owl-carousel"></div>

Upvotes: 3

Related Questions