Many of the images on my site link to larger versions that show up in popup windows. These windows all have the same base url, but have variables passed to them via the get method. PHP captures the values in the url, and inserts values into the img src tag on the popup pages to display the larger versions of the images. The snippet below shows an href that calls the javascript newwindow on a base page.

As the popup page loads, the image data is loaded into the browser. Only after the image loads, the myimages script is called to determine the size the page should be. myImages checks to see that an image exists, then gets the width, and height of the image.

myImages then adds spacing around the width and height (150 pixels in this case), and compares the result to the maximum size I allow a popup page to be. I chose 1024 by 768 because most of my images should be smaller than a 17 inch monitor's dimensions. Larger images will have scroll bars, but they're very rare. If the window size is greater, the maxsizes are used.

Finally, the script actually moves and resizes the window. The window is moved to 1,1 (upper left corner of the screen), then offset by 10 pixels in both directions, and then the window is resized.

Believe it or not, I found that some browsers did not properly implement the moveTo method when given numbers like 10,10, but DID work when given 1,1. SO, I first moved to 1,1 then offset to 10,10 (it's prettier), and finally resized the window to the width and height I wanted.

Resizing the window before moving could result in a window that tries to expand beyond the screen area. Some browsers do not let you do this, and can cause inconsistent results.