countdown script that uses images

[DavidR]

Hey all,

I really need a countdown script that isn't text, but images, so 0, 1, 2, 3 etc. to 9 are all saved as image files.

Does anyone know where I cud get one from? I hav searched Hotscripts but found none :S

Thanks for ur help
Dave

[vgarcia]

I wrote something similar to what's below a few months back. It actually changed text every 30 seconds, but this should work for images.

<script type="text/javascript" language="javascript">
	//number of seconds between refreshes; change this 
        //number to change frequency of updates
	var DEFAULT_TIMELEFT = 30;
	
	//variable that counts down.
	var timeLeft = DEFAULT_TIMELEFT;
	
	//temporary variable to store which array member is to be displayed next
	var showMember = 0;
	
	//arrays that store the image paths to be used. Change this
        //to meet your needs
	var imgs = new Array("0.gif", "1.gif", "2.gif", "3.gif", "4.gif", "5.gif", "6.gif", "7.gif", "8.gif");
	
	
		
	function refreshImage(imgName) {
	       var elImg;
		//get relevant elements
                //for DOM browsers
                if (document.getElementById) {
		elImg = document.getElementById(imgName);
                elImg.setAttribute("src", imgs[showMember]);
		} else {
                //for non-DOM browsers
                if (document.images) {
                  elImg = document.images[imgName];
                  elImg.src = imgs[showMember];
                 }
                }
		
		//incrememt counter
		showMember++;
		//reset if showMember is 9
		if (9 == showMember) showMember = 0;
		timeLeft = DEFAULT_TIMELEFT;
	}
	
	function countDown(imgName) {
	//if right column is not in the page, then don't run this
	timeLeft--;
	//alert(timeLeft);
	setTimeout("countDown(" + imgName + ")", 1000);
		if (timeLeft == 0) {   
	 		refreshImage(imgName);
			timeLeft = DEFAULT_TIMELEFT;
		}
	}
	
	//tell this script to run 
        //put in the ID of the image you want to swap in the line below.
	countDown("swapper1");
</script>

You'll need some HTML like this to go along with it .

<img id="swapper1" name="swapper1" src="9.gif" alt="" />

Hope this helps!