Creating a Popup Window That When Clicked Will Show Your Fullsize Image or Document

Neil Mey
Pop Up Window

From a thumbnail image in a gallery a link will be created that will bring up a fullsize image in a browser window the same size as the image with no space.

1.You will need an html file with a fullsize image placed in it say like 300 x 300. In this html file right click and select page properties. In this menu under appearance change the margins to 0 all around.

2. From the fullsize image you should make a thumbnail or smaller file like 150 pixels wide.

3. In a new html document insert the thumbnail image.

4.Select the image

5. Go to Window in the Dreamweaver menu and select it. Scroll down to behaviors and click it. A pallete or menu should pop up on screen to the left saying tag and underneath saying attributes and behaviors.

6. You will see a + sign. Click on this and scroll down to open browser window and select it.

7. A window menu should pop up. Under url to display browse to the fullsize image html file you created.

  1. Under window width and height type in the pixel size of the full size image in your html document. In our case it is 300x300 and click ok
  2. After you have done this in the tag menu text should have been created in it saying on load and next to that open browser window. Click once on the on load text. A drop down menu should appear next to it. Select it and scroll down to on click. This will make it so that when you click on the image your full-size html file will come up.
  3. Save your file and preview in browser. When you click on the image your fullsize image html file should popup but cropped to the image width and height you specified earlier.

Published by Neil Mey

My name is Neil Mey. I am from Saint Louis Missouri and have a Master of Arts degree in Communications from Lindenwood University. I am currently an Instructor at Lindenwood University as well.  View profile

Since the user has to click on the link to bring up the popup window most pop up blockers will let this slide through.

To comment, please sign in to your Yahoo! account, or sign up for a new account.