Adding simple Pagination to an existing Slideshow

I’d like to add simple pagination to this existing script: & wonder if someone could help me with it.

So basically it would count the number of <div class=“slide”> instances and then generate a list (e.g. 1 - 2 - 3 - 4) and each has a hyperlink to that specific slide.

I’m not so hot with Javascript so would love some help with this.

Many thanks for any pointers :slight_smile:

I’d recommend you use something that’s already written to do that, of which there are many. Here is a good one:

The options page explains how to change the dots at the bottom to digits.

Thanks for your reply :slight_smile:

Out of interest, do you know if this slider allows you to replace <img> with <div> ?

I’m sure that would be fine, as the script acts on the <li>s rather than on the images. The bxSlider site must have been updated recently. The previous examples had text along with images inside each <li>. I don’t see any reason why that can’t still be done.

There are other examples, like Anything Slider.

Thanks for the reply. Yep, I might take a look at Anything too.

The documentation for using <div> content as opposed to <img> on bxslider is very hard to find :cry:

I’m basically wanting to use nested slideshows. So a parent and a child slideshow within it.

Thanks for the help :slight_smile:

I just tried replacing the img in bxSlider with a mixture of floated divs and images, and it worked fine. You just have to watch out for some of the styles that already apply to the slider.

But I’m not sure what you mean by a “parent and a slideshow within it”. Maybe I am missing the point.