"Popup" window from thumbnail to full size image: How to do?

Soldato
Joined
4 Feb 2004
Posts
13,430
Location
Écosse
Hi,

I've been playing around with the "Behaviours" attributes in Dreamweaver CS3 for a few small thumbnail pictures I have on the "Welcome" page of my latest website project:-

www.ouralgarvehouse.com

Now, I've tried getting this to work, but I appear to be missing something or doing something wrong.

I can get the Behaviour set so that upon either "mouse over" or clicking the small thumbnail image, the browser opens the full size picture in another window, but the window it opens is far too large?. I want to get the thumbnail to "popup" and open in a small window which is the same size as the full size image of the thumbnail which in this case, is a picture of 400x268, without taking the user away from the main page if you know what I mean?.

So far, I've managed to get it to open, but not in the size required.

Any assistance and advice appreciated!!!
 
That looks interesting and pretty much just what I'm looking for, but I've just downloaded it and read through the instructions and it has confuzzled the heck out of me as to where to put what!!!?? :confused:
 
I'm just not really sure where to put what??.

I downloaded the lightbox2 V2.03.3 file, unzipped it and added the folder to the folder containing my site.

I looked at the instructions on the lightbox2 site but I'm not sure where to put the :-

Code:
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

....in my page?. Does that go into my index page at the top of it?.

From Step 2 onwards on the lightbox2 website instructions page, I'm a bit lost.

Do I need to add the images I want displayed in the pop up box into the image folder within the lightbox folder?. And if so, I'm not sure what to put in as the link from the thumbnail pictures where it says add the link in "Part 2 Activate" as in:-

"Add a rel="lightbox" attribute to any link tag to activate the lightbox."

Code:
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

I assume I change the image-1.jpg to whatever the name of the image I want to have displayed is?.

Cheers, bit of a n00b at this to be honest.
 
I looked at the instructions on the lightbox2 site but I'm not sure where to put the :-

Code:
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
....in my page?. Does that go into my index page at the top of it?.

in the head section of your page




Do I need to add the images I want displayed in the pop up box into the image folder within the lightbox folder?. And if so, I'm not sure what to put in as the link from the thumbnail pictures where it says add the link in "Part 2 Activate" as in:-

"Add a rel="lightbox" attribute to any link tag to activate the lightbox."

no, in an images folder which is within the folder that your pages are in

Code:
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
I assume I change the image-1.jpg to whatever the name of the image I want to have displayed is?.

yep.

Cheers, bit of a n00b at this to be honest.
 
Back
Top Bottom