Using slick to create a carousel from li elements

Question

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/

Answer 1

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.