How to Loop Images in a webpage with an even delay?

**AP17758** · 07-22-2008 05:51 AM

Hi,

i have a requirement that i need to loop through a series of images(say 4 images) with an even inteval of time.

I need the first image to come and after some 4 secnds the next image and then the next image.

i used 'setTimeout and setInterval' both doesnt seems o be helping me out.

So pls help me out.

pls find the code that i ve written below:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body Onload="m();">

<SCRIPT type="text/javascript">
var pictureArchive= new Array(4);
	pictureArchive[0]='1.jpg';
	pictureArchive[1]='2.jpg';
	pictureArchive[2]='3.jpg';
	pictureArchive[3]='4.jpg';
var secs
var timerID = null
var timerRunning = false
var delay = 1000
var j=0;
function m()
{
	for (i=0;i<4;i++)
	{
		InitializeTimer();
	}
}

function InitializeTimer()
{
    // Set the length of the timer, in seconds
    secs = 2
    StopTheClock()
    StartTheTimer()
}

function StopTheClock()
{
    if(timerRunning)
        clearTimeout(timerID)
    timerRunning = false
}

function StartTheTimer()
{
    if (secs==0)
    {
        StopTheClock()
\\ print the images here
        document.write("<img src='"+ pictureArchive[0] +"'/>");
			
	
    }
    else
    {
        self.status = secs
        secs = secs - 1
        timerRunning = true
        timerID = self.setTimeout("StartTheTimer()", delay)
		
    }
}
//-->
</SCRIPT>



</body>
</html>

Thread: How to Loop Images in a webpage with an even delay?

Thread Tools

Display

Threaded View

How to Loop Images in a webpage with an even delay?

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions