JavaScript: Change Image and Link every X Seconds

Next to the images, you can also write the links into an array in order to change the links at the same time you are changing the images.

For example, you can extend your code in the following way:

var x = 10; // seconds
var images = ["img/img1.jpg", "img/img2.jpg", "img/img3.jpg"];
var links = ["link1.htm", "link2.htm" , "link3.htm"];
var index = 1;
 
setInterval(function() {
  document.getElementById("main-image").src = images[index];
  document.getElementById("main-link").href = links[index];
  index = (index + 1) % images.length;
}, x * 1000);

Of course, you have to ensure that there are the same number of links and images (the arrays must have the same length) and the order must fit (first element in the image array have to fit to the first element in the link array and so on).

The HTML can be adjusted in that way:

<a id="main-link" href="link1.htm">
   <img id="main-image" src="img/img1.jpg">
</a>

As you can see, the ID "main-link" is used to set the link and the ID "main-image" is used to set the appropriate image.
2016-01-23 at 12:04