Random selecting picture groups

[srenkema]

Hi everyone, I'm a complete newbee with respect to html and java coding. I currently build a bit on my own site, designing and coding (

http://www.samrenkema.eu)

You will see that I randomly change the main illustrations. I do this by the following code:

----------

<script language="JavaScript">

<!-- Begin
// Set up the image files to be used.
var theImages = new Array()

theImages[theImages.length] = {
info:'Physalis Peruviana',
left:'../images/middle_left.gif',
right:'../images/middle_right.gif'
};
theImages[theImages.length] = {
info:'Desert Rose',
left:'../images/middle_left2.gif',
right:'../images/middle_right2.gif'
};
theImages[theImages.length] = {
info:'United world',
left:'../images/middle_left3.gif',
right:'../images/middle_right3.gif'
};
theImages[theImages.length] = {
info:'pcfeather',
left:'../images/middle_left4.gif',
right:'../images/middle_right4.gif'
};

var j = 0
var p = theImages.length;
var preBuffer = new Array()
for (i = 0; i < p; i++){
preBuffer = new Image()
preBuffer.src = theImages
}
var whichImage = Math.round(Math.random()*(theImages.length-1));
function showLeftImage(){
document.write('<img src="'+theImages[whichImage].left+'"/>');
}
function showRightImage(){
document.write('<img src="'+theImages[whichImage].right+'"/>');
}
// End -->
</script>



and later



<td valign="top" width="600" height="260"><script language="JavaScript">
<!--
showLeftImage();
//-->
</script></td>
<td width="200" height="260" valign="top"><script language="JavaScript">
<!--
showRightImage();
//-->
</script></td>


-------------


NOW, what I need is the right one of these 2 images to be a background image as I want my sub-navigation on top of it.

HOWEVER, I have no idea how to fix this?! Is there anyone that can help me with it?



Thank you SO SO much! I really can't figure it out...