[otis52]

Hey all. A qiuck question for all the webmasters out there. I'm doining a little site for my biz and need some help. Could someone tell me how to or where I could find some info on how to make pop up windows. I have images linked to thumb nails on my page now but the images keep opening up in a browser window when clicked on. I would rather have the image open in separate window not a browser window. check this link to see what I mean <a href="http://c1g.net/graph.html" target="_blank">http://c1g.net/graph.html</a> If you could help me with this matter I would really appreciate it. Thanks...

[dvwannabe]

If you're using dreamweaver, you can do it with the behaviors option. It's a piece of cake, just make sure you choose "on click" not " on press" because Netscape doesn't work with the "on press"

or you can go to this link and it will generate the code for you:

<a href="http://javascript.internet.com/generators/popup-window.html" target="_blank">http://javascript.internet.com/generators/popup-window.html</a>

good luck

[otis52]

Thanks for the advice dvwannabe. Unfortunetly I have already done this whole thing in GoLive and I am not to familar with Dreamweaver yet. So if there is any one out there that uses GoLive and knows how I could go about setting up my work in pop up windows rather then having it appear in a browser window I would be very grateful. I also tried useing the code generator like you said but couldn't get the code to work either. Thanks for the help.

[skalie]

It's javascript, type "javascript, pop-ups and tutorial" into a search engine and you will get dozens of pages telling you whats going on.

Basically you give a link a target, I believe target = "blank" or "none" opens it in a new window, you can then set the properties like scroll = none, resize = none etc. etc.

Throw "chromeless pop-up" into a search engine.

In my opinion Javascript should be the first thing to learn after HTML.

[Simon Mundy]

Wait a minute - do you mean popup windows as in a dynamic layer, rather than pop-up windows as in new small browser windows?

If you do (and you work in GoLive) it's still going to be pretty easy. In fact, probably even cleaner. It's going to be a bigger download, however, so go easy.

Say you have 10 images that are 350 x 250 - make the thumbnails 70 x 50 and call them thumb1.jpg, thumb2.jpg, etc.. Then name each of the fullsize pics pic1.jpg, pic2.jpg.

Now a new golive page, drag a floating box onto the layout and position it at (for example) 200x, 150y. Make it 350 width x 250 height. Now drag an image element into it, and make it point to a transparent spacer.gif and give it the same width and height. Under the 2nd tab there should be extra options for 'name' - call it 'gallerypic' (without the quotes, obviously). Your code may look something like this: (please note, i've replace the < with [ and > with ] so these boards don't mess it up!):

[div id="layer1"][img src="spacer.gif" alt="" name="gallerypic" height="250" width="350" border="0"][/div]

Select the image and give it a link, but instead of typing in a filename, type a #

Now select that floating box and make it invisible.

Ok, so now add a table and pop all your thumbnail pics into them. For each thumbnail, create a link and where you would normally type a filename, type a #

Still with me? :-)

OK, now for the boring bit - you've got to select each thumbnail and attach an action to it. So select the pic, find your 'actions' palette and select the 'Mouse click' event and add 2 new events. The first is a 'Multimedia' action where you set the 'show/hide' action to 'show' 'layer1'. The second is an 'image' action where you set 'Set Image URL' for 'gallerypic' to 'pic1.jpg' (for thumbnail1.jpg), 'pic2.jpg' for thumbnail 2, etc, etc...

Lastly, make your floating layer visible again, select the spacer image and give it a # link as well. Now give this an action - a 'Multimedia' action where you set the 'Show/Hide' action to 'hide' 'layer1'. Make the layer invisible again.

So basically this uses 1 layer to show/hide a placeholder image, which will load an image and display each time you click a thumbnail. Clicking on the large image will close the box down. Voila! (Hopefully).

Naturally, as this is GoLive, you're going to generate an ugly mess of non-compliant code, but at least you can see how to get started. When you're up to writing your own code, or at least implementing some more graceful JavaScript, head on over to <a href="http://www.dynamicdrive.com" target="_blank">http://www.dynamicdrive.com</a> where they've got heaps of goodies.

Good luck