Slick JS does not show points

Question

I am using Slick.js

For some reason I can’t show what the dots show.

This is what I have.

<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="slick/slick.min.js"></script>

HTML markup

<div class="single-item">
  <div><img src="img/shadow.jpg" alt=""></div>
  <div><img src="img/shadow.jpg" alt=""></div>
  <div><img src="img/shadow.jpg" alt=""></div>
</div>

Call and options

$(document).ready(function(){
    $('.single-item').slick({
           dots: true,
          infinite: true,
          speed: 500,

    });
});

Strange groups images in a slide show. If I check if it works with autostart, the carousel works. Points simply do not appear, although I call them.

style.css

CSS to script here

Answer 1

I am already testing jsfiddle. The dot shows. Uses the same option as you. Can you try to remove your .css style and check if it works or not. I think maybe a problem with css or you can share the contents of style.css here.

http://jsfiddle.net/bo37aLbz/

$(function () {
    var slickOpts = {
        dots: true,
        infinite: true,
        speed: 500,
        autoplay: true
    };

    // Init the slick    
    $('.single-item').slick(slickOpts);
});

Answer 2

. overflow:hidden - CSS. , .

"" bottom: -45px.

, overflow:hidden, Slick , .

Answer 3

script:

$(document).ready(function(e) {

   $('.slicker1').slick({   

        centerMode:false,     
        draggable:false,    
        arrows:true,    
        autoplay:true,
        autoplaySpeed:1500,     
        slidesToShow:1,     
        slidesToScroll:1,   
        dots:true,

    }); 

 });

Answer 4

.

overflow: hidden, customPaging . customPaging .