Here is some simple JavaScript that I use on my sites to handle this sort of thing. I auctually use this code to support clickable thumbnail images as a link to a pop-up window containing the full-size image, with an appropriately sized and centered window. To impliment this code, you need to call the Javascript function zoomLink() with the following parameters for each clickable link:
thumb: URL to the thumbnail image file - can be absolute or relative
tWidth and tHeight: the width and height of the thumbnail image
bigPict: URL to the large image file - again, this can be absolute or relative.
bigWidth and bigHeight: the width and height of the large image
The JavaScript is as follows:
<!--
// test for advanced browsers
var ns4 = false;
var ns6 = false;
var ie4 = false;
if (document.layers) { ns4 = true; }
if (document.all) { ie4 = true; }
if (document.getElementById && !document.all) { ns6 = true; }
function zoomLink(thumb, tWidth, tHeight, bigPict, bigWidth, bigHeight) {
zRef = "<A HREF=\"javascript:popZoom('" + bigPict + "', " +
bigWidth + ", " + bigHeight + ")\">";
document.write(zRef + "<IMG SRC=\"" + thumb + "\" " +
"WIDTH=\"" + tWidth + "\" HEIGHT=\"" + tHeight + "\" " +
" ALT=\"Click Here for larger image\"></A>\n");
}
var aw = 640; // arbitrary default screen width - sort of assumes if the browser
// is that old, the computer might be old, too!
if ((ns4) || (ns6)) { aw = window.innerWidth; }
if (ie4) { aw = screen.availWidth; }
function popZoom(pictURL, pWidth, pHeight) {
var sWidth = aw;
var x1 = pWidth+10;
var y1 = pHeight+10;
var pZoomStr = "height=" + y1 + ",width=" + x1 + ",left=" + ((sWidth-x1)/2) +
",top=60,scrollbars=0,menubar=0";
pZoom = window.open("","", pZoomStr);
pZoom.document.open();
pZoom.document.writeln("<HTML><BODY BGCOLOR=\"skyblue\"" +
" onBlur='self.close();'>\n");
pZoom.document.writeln("<IMG SRC=\"" + pictURL + "\" WIDTH=\"" +
pWidth + "\" HEIGHT=\"" + pHeight + "\">");
pZoom.document.writeln("</BODY></HTML>");
pZoom.document.close();
} // end popZoom
// -->
Note the pop-up has an onBlur function to close itself automatically if the user clicks outside the window. You might want to remove that. Its a tough call. I like it because it reduces inadvertant desktop clutter for novices, but UI purists wouldn't like the magic disappearance of the window. Anyhoo, I hope it helps.
Richard L. Trethewey
www.rainbo.net