New Window with image
[349 byte] By [FZ1] at [2007-11-19 22:49:28] 
I am making a photo web page for my family and I would like to be able to have a thumbnail of a pic and click on it which would bring up a new window (full screen) that will display the full sized pic. I have found a few scripts but I seem to be having issues with them. I'm sure this is simple but I haven't begun to learn JS yet. Thanks!
# 1 Re: New Window with image
Are all the images the same size? If they are, you can simply do something like:<script type="text/javascript">
function popImg(o) {
var src = o.src;
var cap = o.alt;
var height = 400; // full screen height is screen.height
var width = 600; // full screen width is screen.width
var w = window.open("","_img","scroll=no,height="+height+",width="+width);
w.document.write("<html><head><title>"+cap+"</title></head>");
w.document.write("<body><img src='"+src+"' alt='"+cap+"' height="+ height +" width="+ width +" style='position:absolute;left:0px;top:0px;'></body></html>");
w.document.close();
}
</script>
<img src="/images/pic1.jpg" alt="First Picture Caption" onclick="popImg(this)">Something like that would work. Now, if you have a thousand or so images (with alt text), you can do the following to add the onclick event handler to each image. (If you don't hve ALT text, you'll have to add that regardless of which way you want to do it, unless you want a default title/caption. It that's the case, just change the cap variable to "default caption"):
<script type="text/javascript">
onload = function() {
var im = document.images;
for(var i=0;i<im.length;i++) {
im[i].onclick = function() {
popImg(im[i]);
}
}
</script>I haven't test any of that, but I'll fix the errors.
Dr. Script at 2007-11-8 0:40:16 >
