hey folks

i have a grid of 3 X 3 pictures. each has a name from 0 to 8.

i have a stock of a bunch of photos, which i would like these 9 to change to randomly in a slide in/out fashion. maybe they can each change at a different interval.

i havwe the following script which i use as a rotator for when i have one image that slides, but having this script X9 times on the page might be a little heavy.

can this be tweaked somehow to draw out of the pool of photos (i dont mind whether there is one big pool, that each image draws from randomly, or whether there is a smaller pool for each image)
and then each image will rotate ?

here is the sample code (functional - for the 1st image only [image0]):

Code:
   
<script language="JavaScript1.1">
<!--

var image1=new Image()
image1.src="../uploads/system/thumbs/463_4E918F1B9A.jpg"
var image2=new Image()
image2.src="../uploads/system/thumbs/463_7FZFZ2E96Z.jpg"
var image3=new Image()
image3.src="../uploads/system/thumbs/463_7292D639F9.jpg"

//-->
</script>  <div id="galleryFeaturedBox">
	
		<a href="/galleries/picture.asp?imgid=8450" title="Photo8"><img src="/uploads/system/thumbs/463_6E25FA3F84.jpg" width="179" alt="Photo8" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide0" /></a>
		
		
	
		<a href="/galleries/picture.asp?imgid=8268" title="F1000036"><img src="/uploads/system/thumbs/463_64CFE916Z1.jpg" width="179" alt="F1000036" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide1" /></a>
		
		
	
		<a href="/galleries/picture.asp?imgid=8463" title="Photo20"><img src="/uploads/system/thumbs/463_58578E78DF.jpg" width="179" alt="Photo20" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide2" /></a>
		
		
	
		<a href="/galleries/picture.asp?imgid=8359" title="F1020003"><img src="/uploads/system/thumbs/463_4E918F1B9A.jpg" width="179" alt="F1020003" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide3" /></a>
		
		
	
		<a href="/galleries/picture.asp?imgid=8047" title="4"><img src="/uploads/system/thumbs/463_95F83Z1E88.jpg" width="179" alt="4" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide4" /></a>
		
		
	
		<a href="/galleries/picture.asp?imgid=8242" title="F1000032"><img src="/uploads/system/thumbs/463_FA5FC11A55.jpg" width="179" alt="F1000032" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide5" /></a>
		
		
	
		<a href="/galleries/picture.asp?imgid=8385" title="F1030015"><img src="/uploads/system/thumbs/463_77ZEEDF3FZ.jpg" width="179" alt="F1030015" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide6" /></a>
		
		
	
		<a href="/galleries/picture.asp?imgid=8112" title="ELIYAHO7"><img src="/uploads/system/thumbs/463_8AEZ2F68A6.jpg" width="179" alt="ELIYAHO7" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide7" /></a>
		
		
	
		<a href="/galleries/picture.asp?imgid=8320" title="F1010025"><img src="/uploads/system/thumbs/463_BB26F6F382.jpg" width="179" alt="F1010025" style="margin: 0 0 6px 3px; filter:blendTrans(duration=3)"  name="slide8" /></a>
		
		
	 
	 </div>

	 
	 
	 			 <script language="JavaScript">
					<!--
					////change number of images below 
					var number_of_images=3	//
					//change speed below (in seconds)
					var speed=2
					var step=1
					var whichimage=1
					function slideit(){
					if (!document.images)
					return
					if (document.all)
					
					slide0.filters.blendTrans.apply()
					document.images.slide0.src=eval("image"+step+".src")
					
					
					if (document.all)
					
					slide0.filters.blendTrans.play()
					
					whichimage=step
					if (step<number_of_images)
					step++
					else
					step=1
					if (document.all)
					setTimeout("slideit()",speed*1000+0000)
					else
					setTimeout("slideit()",speed*1000)
					}
					//-->
					</script>

THANKS!!