In addition to displaying random images from a collection on the homepage, it now changes a random photo on the page every 10 seconds to another image from the collection.

First, I created the timer and it will call the changeImg function every 10 seconds (10000 milliseconds):

var myTimer = setInterval(changeImg, 10000);

Then I get two random numbers. One to grab a random image from the pool of available images (100+) stored in the BGImages array:

function getRandNum() {
min = Math.ceil(1);
max = Math.floor(BGImages.length – 1);
randNum = Math.floor(Math.random() * (max – min)) + min;
return randNum;
}

And a second one to pick a random image on the homepage to change (60 total):

function getRandImg() {
min = Math.ceil(1);
max = Math.floor(60);
return Math.floor(Math.random() * (max – min)) + min;
}

For the changeImg function, I grab the random numbers, get the random photos and make the change. Once it runs out of images, it turns the timer off:

function changeImg() {
if (BGImages.length > 1) {
randNum = getRandNum();
randImg = getRandImg();
document.getElementById(“BGImg” + randImg).src = BGImages[randNum];
BGImages.splice(randNum, 1);
}
else {
clearInterval(myTimer)
}

It sounds odd, but I really love writing Javascript!