Jump to content

Multiple Sliders with the W3 schools Slideshow tutorial


Recommended Posts


I am following the tutorial here to create multiple slide shows on my single page site. - getting to grips with JS


It says i need to add a customer class to each slideshow slide1, slide2, etc 

I wish to add a 3rd, and cant seem to get it working. is there anything i need other then the below to get this to work, 

let slideIndex = [1,1];
/* Class the members of each slideshow group with different CSS classes */
let slideId = ["mySlides1", "mySlides2", mySlides3]
showSlides(1, 0);
showSlides(1, 1);

function plusSlides(n, no) {
  showSlides(slideIndex[no] += n, no);

function showSlides(n, no) {
  let i;
  let x = document.getElementsByClassName(slideId[no]);
  if (n > x.length) {slideIndex[no] = 1}
  if (n < 1) {slideIndex[no] = x.length}
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";
  x[slideIndex[no]-1].style.display = "block";


Any help will be most appreciated, thanks for your time.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...