Question

I’m new to Javascript and I was trying to figure out how to move between images. My goal is to change code for the image placeholder in the html so that on every button click, it changes to the next image. I’ve figured out how to change one image to another (getElementById(“mainImage”).src=”image2.jpg”;) but I need to be able to now get to “image3” on the next button click. I assume I need to use variables, but I have no idea how to get this to work…

Answer 1

You can add some var key = 0; before your scripts and then in your script give action for click event

var image = "image" + key + ".jpg";
getElementById("mainImage").src= image;
if(key == max){
 key = 0;
}else{
 key++;
}

where max is your images count.

But I think there can be easier and better solution in jQuery 🙂