Unglazed dots feature not displayed

Question

I am creating a website that has a slider on top, I wanted to use unlider because it seems very simple.

According to the site, you should simply use the dots: true function dots: true

I have it, but my slider has no slides.

The site where I am trying to set things up .

(his school project)

Answer 1

Try adding CSS.

 .dots { position: absolute; left: 0; right: 0; bottom: 20px; text-align: center; } .dots li { display: inline-block; width: 10px; height: 10px; margin: 0 4px; text-indent: -999em; border: 2px solid #fff; border-radius: 6px; cursor: pointer; opacity: .4; -webkit-transition: background .5s, opacity .5s; -moz-transition: background .5s, opacity .5s; transition: background .5s, opacity .5s; } .dots li.active { background: #fff; opacity: 1; } 

Answer 2

Just go to the unslider.css file and add:

 .unslider { overflow: auto; margin: 0; padding: 0; /*Added*/ position: relative; } 

And in unslider-dots.css add:

 /*added*/ .unslider-nav{ position: absolute; width: 100%; bottom: 2%; } 

Just say in script nav:true and dots:true .

Hope this works for you too.