View image in popup from hyperlink

[MrsBinGA]

I've created a website for a rubber stamping demonstrator. I want to be able to click a line of text (such as the name of a stamp set) and have the image of that stamp set pop-up in a small window. Does anyone know where I may obtain the script? I've searched the forums on this site and others until I'm so "brain dead" and "confused" I think I'm going to short-circuit. :eek:

Any help will be greatly appreciated!

Kindest regards,
Mrs B in Georgia, USA

[AdamGundry]

You can use something like this for a hyperlink:

<a href="image.gif" target="_blank" onclick="window.open('image.gif', 'popup', 'height=200, width=200'); return false;">View Image</a>

This will display image.gif in a new window, with or without Javascript enabled (it's prettier with Javascript). Note you need to change both references to image.gif in order to make the code work properly.

Adam

[MrsBinGA]

Adam,

Thank you for your post. I guess I'm still doing something wrong as when I try to use the script I get a "script error" message.

Below is what I have. I've changed the "image.gif" text in your script and used the actual path to my "freshflowers.jpg" file. And changed the height and width from "200" to the actual size of my picture. Was I correct in doing both of these?

<a href="file:///C:/MyWebs/SharonMay/images/freshflowers.jpg" target="_blank" onclick="window.open('file:///C:/MyWebs/SharonMay/images/freshflowers.jpg', 'popup', 'height=311, width=280'); return false;">Fresh Flowers</a>

Kindest regards,
Mrs. B in GA, USA

[AdamGundry]

The code works in IE 6.0 and Mozilla 1.3, as far as I can tell. What error message are you getting?

Are you aware that the URL to the image you have used will only be available offline, as it is stored locally on your computer?

Adam

[MrsBinGA]

Adam,

Since I'm relatively new as a webmaster and especially where JavaScript is concerned, I don't always understand how to preview my pages to see if they're working correctly. My "error" message for the script you gave me was due to one such incident of "ignorance." I was trying to "preview" my script in the Preview portion of FrontPage 2000 instead of previewing it in my browser. :o Some things I can preview in FrontPage to see if they work, but evidently the JavaScript situation was not one of them. :)

Your script works perfectly! Thank you very much. Now I want to learn how to put a "Close Window" function in the popup window that has my image in it. I keep reading JavaScript tutorials on the www and I will learn. :)

I also want to learn how to make a regular size image of a picture open in a popup window when I click a thumbnail size picture of the image.

Thank you again for the script!

Mrs. B in GA

P.S. I corrected the URL "problem". Thank you for pointing that out, too.

[AdamGundry]

You can create a close window link with this HTML code:
<a href="#" onclick="window.close()">Close Me</a>

Note this will immediately close a window you opened, whereas if you did not open the window it will display a warning to the user.

For the thumbnail image, just use a scaled down image file which uses a hyperlink like the one I mentioned earlier to open the full image file.

Adam

[MrsBinGA]

Thank you once again for your help!