this screenshot shows you the model, which i used for displaying photos.
there are two files to comunicate with each other and display a picture.
function showThe(width, height, img){
document.theForm.iwi.value = width;
document.theForm.ihe.value = height;
in the main page there is a form "theForm" with hidden text fields called "isrc", "iwi" and "ihe" . on user's click javascript function sets value of one field to the path to the image, and other two to the dimensions of the image to be shown. it also opens photoview.html in another window which has width and height matching those of the image.
document.title = opener.document.theForm.isrc.value.substring(opener.document.theForm.isrc.value.indexOf("/")+1, opener.document.theForm.isrc.value.length);
wid = parseInt(opener.document.theForm.iwi.value);
hei = parseInt(opener.document.theForm.ihe.value);
thesource = opener.document.theForm.isrc.value+"";
in the photoview.html there are 2 pieces of code shown here.
first, i set the title of the page to the name of the file with some string editing methods, like substring and indexOf. then, it gets the path to the image file, as well as the dimensions. note the string handling with image width and height. you have to use parseInt method to make the browser understand that the width value is not a string, but an integer.
actually, that's it.
document.write('<a onFocus="this.blur();" href="javascript:self.close();" ');
document.write('<img src="'+thesource+'" width="'+wid+'" height="'+hei+'" border="0"');