animating a image with javascript

samit posted this at 14:50 — 10th December 1999.

They have: 5 posts

Joined: Aug 1999

Hi!!

thanks for the link on image transition , Jhon!!

now i have another problem
i want to animate an image , like there are three images stored
in an array and the have to be rotated forever???

stumbling blocks are .....

1. i want to make an array each element of which is an image

eg.
imgaray= new Array ( some_number);

imgaray[0]=new Image( height , width );
imgaray[0].src="imgsrc.gif";

repeat the above two lines for a number of times as many as number of images
or use a loop for elegant loking code

am i correct.....

2. create a looping function to loop infinitely
and also loop the images.. such as if there
are three images. then the outer loop will run indefinitely
and a condition restarts the image count to the first
after the image has been displayed

eg.
count=0;
imgcount=0;

function animate(name) // name is the name of the image in the body
{
for (a=1; a==1; count ++, imgcount++)
{
if(imgcount==3)
{ imgcount=0 }
setTimeout( "change (name)", 1000);
}
}

function change(name)
{
document[name].src=imgaray[imgcount];
}

anything wrong above???

3. now the html

<html>
<head>
<title>sifjjfghsdrhgjrg</title>
<script>
<!--
//all of the above and some variable declaration

//-->
</script>

<body onLoad="animate( image_name)"> // problem i havent created the image and assigned a name to it.. this will be latter which comes latter
//so will this work??
<img src="some_image.gif" name= "image_name">// can i call animate from somwhere else from inside the img tag perhaps
//

</body>
</html>

John Pollock posted this at 18:00 — 11th December 1999.

He has: 628 posts

Joined: Mar 1999

I have a slide show script at:
http://www.javascriptcity.com/scripts/local/simage5.htm

It does most of what you want to do, perhaps with a few modifications (removing captions, changing the setTimeout to a shorter time) it would just be an animation script? Might be worth a try.

<UPDATE>
I made a new script out of it, this should do the trick:
http://www.javascriptcity.com/scripts/local/simage6.htm

</UPDATE>

[This message has been edited by John Pollock (edited 11 December 1999).]

Java Script: A Beginner's Guide
Page Resource