Dev Shed Forums

I would like to link a series of thumbnail images to bring up large images in a popup window. I want the large images to appear on a coloured background, but I don’t want to write a separate web page for each one (there are quite a few). I decided to write a single page containing one large image and change it’s source with the following link:

<A HREF="#" onClick="window.open('popup.htm', 'popup_image', 'dependent=yes, height=425, menubar=no, resizable=yes, status=no, toolbar=no, width=325');
popup_image.document.image.src='large_image.jpg';">
<IMG SRC="small_image.jpg">
</A>

The source of the new window, popup.htm, contains the following:

<IMG SRC="" HEIGHT="400" NAME="image" WIDTH="300">

When I click the thumbnail image I get an error saying ‘popup_image’ is undefined.
What am I doing wrong?

Thanks in advance!
Christine

I don't know what's wrong with your code, but I would call the popup with a parameter, you can get this back in a little script in the popup and fill the name in there.
The call would be something like :
<BLOCKQUOTE><font size="1" face="Verdana,Arial,Helvetica">code:</font><HR><pre><A HREF="#" onClick="window.open('popup.htm?large_image.jpg','popup_image', 'dependent=yes,height=425,menubar=no,resizable=yes,status=no,toolbar=no,width =325')"> <IMG SRC="small_image.jpg"></A>[/quote]

To get the name back in the popup you could use something like this on the place where the image-name (SRC=...) is needed :

<BLOCKQUOTE><font size="1" face="Verdana,Arial,Helvetica">code:</font><HR><pre><script language="javascript">
<!--
largeImage=String(location.search);
largeImage=largeImage.substring(1);

document.write(largeImage);
//-->
</script>[/quote]

Hope this helps you along,
Gerrit.


[This message has been edited by Gerrit (edited 07-09-99).]