javascript - Slick slider replace dots with numbers -


i'm trying replace slick slider / carousel pagination numbers instead of dots. have project setup in js fiddle , have have custom function displays current slide count of total of 6. have '1' replacing dots have numbers represent total number of slides.

js fiddle demo

html

<section class="slider">  <div>slide1</div>  <div>slide2</div>  <div>slide3</div>  <div>slide4</div>  <div>slide5</div>  <div>slide6</div> </section>  <span class="paginginfo"></span> 

javascript

$(".slider").slick({ autoplay: true, dots: true, custompaging : function(slider, i) { var thumb = $(slider.$slides[i]).data(); return '<a>1</a>'; }, responsive: [{      breakpoint: 500,     settings: {         dots: false,         arrows: false,         infinite: false,         slidestoshow: 2,         slidestoscroll: 2     }  }] }); 

if catch meaning, change line:

return '<a>1</a>'; 

to this:

return '<a>'+i+'</a>'; 

or

return '<a>'+(i+1)+'</a>'; 

depending on want index start.

here updated fiddle: https://jsfiddle.net/rllvvpcm/5/


Comments

Popular posts from this blog

ruby - Trying to change last to "x"s to 23 -

jquery - Clone last and append item to closest class -

c - Unrecognised emulation mode: elf_i386 on MinGW32 -