HighDots Forums  

cycle img src based on a time interval

JavaScript discussion (multi-lingual) JavaScript discussion (alt.comp.lang.javascript)


Discuss cycle img src based on a time interval in the JavaScript discussion (multi-lingual) forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
Jason
 
Posts: n/a

Default cycle img src based on a time interval - 01-20-2006 , 09:00 AM






Can someone give me a snippet of code that cycles an image every 5 seconds?

I have an image on my page that needs to change the src tag every 5 seconds.
All the code that I've seen that is similiar to this would cycle the image
on mouseover or onclick...

I've thought about doing a rotating GIF image, but I'd like to do it with
javascript if at all possible.

Thanks,

-- Jason



Reply With Quote
  #2  
Old   
webdood
 
Posts: n/a

Default Re: cycle img src based on a time interval - 01-20-2006 , 06:53 PM






<script language="javascript">
var iArray=new Array();
iArray[0] =
"http:\/\/home.tiscali.nl\/remindcreations.com\/pinhead%20%202.jpg";
iArray[1] = "http:\/\/static.flickr.com\/18\/22505115_53ea8cd9b4.jpg";
iArray[2] = "http:\/\/www.3demonic.com\/images\/pinhead_LM02.jpg";
iArray[3] = "http:\/\/badelements.net\/crumb.jpg";

var swapImage = new Object();
function StartCycle() {
swapImage.imgCtr = 0;
swapImage.Timer = setInterval("SwapImage()", 5 * 1000);
}

function StopCycle() {
clearInterval(swapImage.Timer);
}

function SwapImage() {
document.getElementById("foo").src = iArray[swapImage.imgCtr];
swapImage.imgCtr += 1;
if (swapImage.imgCtr > iArray.length-1) {
swapImage.imgCtr = 0;
}
}
</script>
<body onload="StartCycle()">
<button onclick="StopCycle()">Stop this craziness</button><br />
<img id="foo"
src="http://www.alvarezwaxmodels.com/Images/Custom%20Images/pinhead-canvas.jpg"
/>
</body>

You are welcome.

Shannon Norrell


Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.