Randomizer Help

[SipherDrakon]

I am using a javascript to randomly display pictures on my site, but there has to be two sets.

Basically on one side is the original artwork the client submits, next to it there is some text, then on the right is the artwork created on one of our products.

I want the images to change everytime the page is loaded, but the two sets have to coinside. Like, I can't have one piece of artwork on the left, but showing a different piece of artwork created on a product, to the right.

If thats at all confusing let me know, here is the code I have been working with. Any help would be appreciated.

	<td>
<!-- left -->
<table border="0" cellpadding="0" cellspacing="0" id="table13">
<tr>
	<td>
	<img src="images/t_11.gif" width="10" height="9" alt="" border="0"></td>
	<td background="images/t_13.gif">
	<img src="images/t_12.gif" width="6" height="9" alt="" border="0"></td>
	<td background="images/t_13.gif" align="right">
	<img src="images/t_14.gif" width="6" height="9" alt="" border="0"></td>
	<td>
	<img src="images/t_15.gif" width="10" height="9" alt="" border="0"></td>
</tr>
<tr valign="top">
	<td background="images/t_fon_left.gif">
	<img src="images/t_21.gif" width="10" height="6" alt="" border="0"></td>
	<td rowspan="2" colspan="2">
<!-- in -->
<table border="0" cellpadding="0" cellspacing="0" width="124" height="124" id="table14">
<tr>
	<td>
<p class="center" align="center">&nbsp; <!--webbot bot="HTMLMarkup" startspan -->
<script language="JavaScript">
function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish
myimages[1]="images/originals/art1a.jpg"
myimages[2]="images/originals/art2a.jpg"
myimages[3]="images/originals/art3a.jpg"
myimages[4]="images/originals/art4a.jpg"
myimages[5]="images/originals/art5a.jpg"
myimages[6]="images/originals/art6a.jpg"
myimages[7]="images/originals/art7a.jpg"
myimages[8]="images/originals/art8a.jpg"
myimages[9]="images/originals/art9a.jpg"
myimages[10]="images/originals/art10a.jpg"
myimages[11]="images/originals/art11a.jpg"

var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<img src="'+myimages[ry]+'" border=0></a>')
}
random_imglink()
//-->
</script>
<!--webbot bot="HTMLMarkup"
endspan -->&nbsp;</p></td>
</tr>
</table>
<!-- /in -->
	</td>
	<td background="images/t_fon_right.gif">
	<img src="images/t_23.gif" width="10" height="6" alt="" border="0"></td>
</tr>
<tr valign="bottom">
	<td background="images/t_fon_left.gif">
	<img src="images/t_31.gif" width="10" height="7" alt="" border="0"></td>
	<td background="images/t_fon_right.gif">
	<img src="images/t_33.gif" width="10" height="7" alt="" border="0"></td>
</tr>
<tr>
	<td>
	<img src="images/t_41.gif" width="10" height="10" alt="" border="0"></td>
	<td background="images/t_fon_bot.gif">
	<img src="images/t_42.gif" width="6" height="10" alt="" border="0"></td>
	<td background="images/t_fon_bot.gif" align="right">
	<img src="images/t_44.gif" width="6" height="10" alt="" border="0"></td>
	<td >
	<img src="images/t_45.gif" width="10" height="10" alt="" border="0"></td>
</tr>
</table>
<!-- /left -->
	</td>
	<td><p class="center" align="center">
&nbsp;</p>
	<p class="center" align="center">&nbsp;</p>
	<p class="center" align="center">
&nbsp;&nbsp;&nbsp; &nbsp;<font size="4" color="565656">Becomes: &nbsp;&nbsp; </font></p></td>
	<td>
<!-- left -->
<table border="0" cellpadding="0" cellspacing="0" id="table17">
<tr>
	<td>
	<img src="images/t_11.gif" width="10" height="9" alt="" border="0"></td>
	<td background="images/t_13.gif">
	<img src="images/t_12.gif" width="6" height="9" alt="" border="0"></td>
	<td background="images/t_13.gif" align="right">
	<img src="images/t_14.gif" width="6" height="9" alt="" border="0"></td>
	<td>
	<img src="images/t_15.gif" width="10" height="9" alt="" border="0"></td>
</tr>
<tr valign="top">
	<td background="images/t_fon_left.gif">
	<img src="images/t_21.gif" width="10" height="6" alt="" border="0"></td>
	<td rowspan="2" colspan="2">
<!-- in -->
<table border="0" cellpadding="0" cellspacing="0" width="124" height="124" id="table18">
<tr>
		<td>
<p class="center" align="center">&nbsp; <!--webbot bot="HTMLMarkup" startspan -->
<script language="JavaScript">
function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish
myimages[1]="images/wbpssmll.gif"
myimages[2]="images/magbcsmll.gif"
myimages[3]="images/fnb4smll.gif"
myimages[4]="images/basmsmll.gif"
myimages[5]="images/art12a.jpg"
myimages[6]="images/ct4smll.gif"
myimages[7]="images/puzg.gif"
myimages[8]="images/kthrtsmll.gif"
myimages[9]="images/mpsmll.gif"
myimages[10]="images/mugsmll.gif"
myimages[11]="images/ktrdsmll.gif"

//specify corresponding links below
var imagelinks=new Array()
imagelinks[1]="../products/wbps.html"
imagelinks[2]="../products/magbc.html"
imagelinks[3]="../products/fnb4.html"
imagelinks[4]="../products/basm.html"
imagelinks[5]="../products/ktrd.html"
imagelinks[6]="../products/ct4.html"
imagelinks[7]="../products/puzg.html"
imagelinks[8]="../products/kthrt.html"
imagelinks[9]="../products/mp.html"
imagelinks[10]="../products/mug.html"
imagelinks[11]="../products/ktrd.html"

var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" border=0></a>')
}
random_imglink()
//-->
</script>
<!--webbot bot="HTMLMarkup"
endspan -->&nbsp;</p></td></tr></table>
<!-- /in -->
	</td>
	<td background="images/t_fon_right.gif">
	<img src="images/t_23.gif" width="10" height="6" alt="" border="0"></td>
</tr>
<tr valign="bottom">
	<td background="images/t_fon_left.gif">
	<img src="images/t_31.gif" width="10" height="7" alt="" border="0"></td>
	<td background="images/t_fon_right.gif">
	<img src="images/t_33.gif" width="10" height="7" alt="" border="0"></td>
</tr>
<tr>
	<td>
	<img src="images/t_41.gif" width="10" height="10" alt="" border="0"></td>
	<td background="images/t_fon_bot.gif">
	<img src="images/t_42.gif" width="6" height="10" alt="" border="0"></td>
	<td background="images/t_fon_bot.gif" align="right">
	<img src="images/t_44.gif" width="6" height="10" alt="" border="0"></td>
	<td >
	<img src="images/t_45.gif" width="10" height="10" alt="" border="0"></td>
</tr>
</table>
<!-- /left -->
	</td>