implementing lightbox with java script getting wrong image

[deansaddigh]

i have this code for displaying pictures big and small.

 

Now i have added a the first link in here

            <div class='mainPhoto'><a href = "admin/images/properties/<?=$imagesResults[0]{'large'}?>" rel="lightbox" ><img src='admin/images/properties/<?=$imagesResults[0]{'main'}?>'  width='299px' height='189px' name="large"></a></div>
        

 

the image when you click on any of there others just shows the same image.

 

I think i need to change some java script.

 

<script language="JavaScript"><!--
//thumbnail script
$(document).ready(function(){

<? 
$y = 1;
   	foreach ($imagesResults as $imageData)
   	{
?>
	image<?=$y?> =new Image();

<?   		$y++; 
   	}
?>


// This defines the source of the display image 

<? 
$i = 1;
   	foreach ($imagesResults as $imageData1)
   	{
?>		

	image<?=$i?>.src ="admin/images/properties/<?=$imageData1{'large'}?>"
<?   		$i++; 
   	}
?>

// This defines the source of the preview image 


<? 
$r = 1;
  	foreach ($imagesResults as $imageData2)
   	{
?>		document.images['pimage<?=$r?>'].src=image<?=$r?>.src;
<? 		 $r++; 
   	}
?>
})
// This defines what to do when an image is clicked on 
function image_click(clicks)
{
<? 


$x = 1;
  	foreach ($imagesResults as $imageData3)
   	{
?>		if(clicks==<?=$x?>){document.images['large'].src=image<?=$x?>.src;}

<? 		 $x++; 
   	}
?>
}

// --></script>

 

Can anyone point me in the right direction if you go here and click on any of the smaller images then click on the main image no matter what smaller image you have selected the bigger one is always the same.

 

http://www.dhcottages.co.uk/testsite/details.php?id=75