Ecko123
Ecko123

Reputation: 308

Using slick to create a carousel from li elements

I'm using slick to create a carousel from list items The structure of list is like this

<div class="slicker">
    <li>
        <img />
    </li>
    <li>
        <img />
    </li>
    <li>
        <img />
    </li>
</div>

I'm unable to create a carousel of it . The content rather appears as a normal list. When checking the node I see the relevant classed added to the dom.

Link for slick :https://kenwheeler.github.io/slick/

Upvotes: 6

Views: 18014

Answers (2)

v2solutions.com
v2solutions.com

Reputation: 1439

Could you please try <div> instead of <li>. slick seems to be working with <div> only.

Upvotes: -3

Rodriguez Lo&#239;c
Rodriguez Lo&#239;c

Reputation: 303

Actually, Slick use div element as slide by default, but you can change it with the "slide" parameter (slide | element | 'div' | Element query to use as slide).

In your case you need to have (in your js) something like:

$('.slicker').slick({
  slide: 'li'
});

You can also change your code with 'div' like "v2solutions.com" said but this change your semantics.

Upvotes: 30

Related Questions