SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Zealot DavidR's Avatar
    Join Date
    Feb 2002
    Location
    London, England.
    Posts
    164
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    countdown script that uses images

    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

  2. #2
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,236
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    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.

    Code:
    <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 .
    HTML Code:
    <img id="swapper1" name="swapper1" src="9.gif" alt="" />
    Hope this helps!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •