View Full Version : How to change an image every 3 seconds?

06-28-2009, 09:38 PM
How do i change an image every 3 seconds between 3 images and on a loop? What is the simplest way to do it?

06-28-2009, 10:06 PM
use javascript's setInterval. array with your images and change the value of the img tag when the interval expires?

06-28-2009, 11:04 PM
I tried this and it does nothing

var AngusYoungInt = 0;
var AngusYoung = new Array();
AngusYoung[1] = new Image();
AngusYoung[1].src = "AngusYoung2.jpg";

var int=setInterval("changeAdd()",3000)

function changeAdd()
AngusYoungInt = AngusYoungInt + 1;
document.getElementById("add1").src = "AngusYoung[AngusYoungInt]";

06-28-2009, 11:13 PM
var imgArray = []

imgArray[0] = "image1.jpg"
imgArray[1] = "image2.jpg"
imgArray[2] = "image3.jpg"
imgArray[3] = "image4.jpg"

var i = 0; //set a counter to keep track of where we are in the array

function imgChanger(){
if(i == imgArray.length){ //if we are on the last item of the array
clearInterval(timer); //clear the interval set
return; //and exit the function
alert(imgArray[i]); //your code here
i++; //increment i each time the function is run
var timer = setInterval( "imgChanger()", 3000 ); //setInterval triggers this function, (specified in quotes) every 3 seconds.

check out http://www.w3schools.com/js/js_timing.asp for how setInterval works