Alternating images

**RealisticGraphics** · Sep 15th, 2000, 09:52 PM

Not difficult:

Code:

<script language="javascript">
//Set up a variable to hold the current image.
var curImg

function animate(tImg){
//Check tImg to find out what the image is displayed
if(tImg == "On.jpg"){

//Set the currently displayed image
	curImg = "Off.jpg"}
else{
        curImg = "On.jpg"}
//Set img1 to be the current image
document.img1.src = curImg;
//set a timer up, mine change about every second
//1000 milliseconds = about 1 second.
window.setTimeout("animate(curImg)", 1000);
}

</script>
<!-- Tell the page to animate -->
<body onLoad="animate('Off.jpg')">
<img src="" name="img1">

In addition the the above you may want to add some preloading code for the images. Let me know if you need anything else.

**Michael** · Sep 16th, 2000, 03:58 AM

Thanks for that - it worked fine.

The images I want to swap are small gifs (<1k) so preloading is not an issue here.

However, I am sure that it would be useful to know for future reference how to preload larger graphics files, so what is the code to do this please?

**RealisticGraphics** · Sep 16th, 2000, 08:50 AM

Well here is a way I came up with that makes preloading lots of images a breeze:

Code:

<script language="JavaScript">
//Pre Load Images
//By Realistic Graphics
var Img = new Array()
var tPath = "img/jpg/comp/"

function PreImg(){
Img[0] = "about2.jpg"
Img[1] = "advert2.jpg"
Img[2] = "contact2.jpg"
Img[3] = "service2.jpg"
Img[4] = "soft2.jpg"
Img[5] = "web2.jpg"

for(i=0; i < Img.length; i++){
var tImg
tImg = "img" + i
tImg = new Image()
tImg.src = tPath + Img[i]
}
}
</script>
<body onLoad="PreImg()">

Let me know if you need anything else.

**Michael** · Sep 17th, 2000, 09:33 AM

Thanks. It is now filed away in my "odds and sods" folder!!!

Can't think of anything else I need at the moment. Thanks for your help.

Thread: Alternating images

Thread Tools

Display

Posting Permissions