PDA

View Full Version : Graphic script help


munga
06-28-2002, 11:44 AM
I am helping my sons with a web page but am unable to do want they want. They would like to place a picture in the center of the page with small graphics under it, two rows of 8 thumbnails. When you click on the thumnail it will be seen in the large graphic image in the center above it. They also would like to be able to supersize any of the graphics, and be able to get back to the home page. The images are 575 x 432. Thanks for any help you can offer

Jim

bcarl314
06-28-2002, 12:11 PM
I think I know what your trying to do. Here's one way to do it.

In your html you can set up your thumbnails like this...


<table>
<tr>
<td colspan="8"><img src="bigImage.jpg" name="big"></td>
</tr>
<tr>
<td><img src="thumb1.jpg" onClick="makeBig('thumb1')"></td>
<td><img src="thumb2.jpg" onClick="makeBig('thumb2')"></td>
<td><img src="thumb3.jpg" onClick="makeBig('thumb3')"></td>
<td><img src="thumb4.jpg" onClick="makeBig('thumb4')"></td>
<td><img src="thumb5.jpg" onClick="makeBig('thumb5')"></td>
<td><img src="thumb6.jpg" onClick="makeBig('thumb6')"></td>
<td><img src="thumb7.jpg" onClick="makeBig('thumb7')"></td>
<td><img src="thumb8.jpg" onClick="makeBig('thumb8')"></td>
</tr>
</table>


then in the <head> section of your html have something like this...


<script language="javascript">
<!--
function makeBig(imgName) {
document.big.src = eval(imgName+"big.src");
}
//-->
</script>


You'll need to sets of images for this to work,
1st set would be
thumb1.jpg to thumb8.jpg
the other set would be
thumb1big.jpg to thumb8big.jpg

I haven't tested this, but it should do the trick.

munga
06-30-2002, 06:04 PM
Thanks!