javaPete
03-04-2004, 08:36 PM
I use a popup window script that uses a close() method to reload the new window. Can anyone explain how that is possible?
The script opens a new window with an image then resizes the window to match the image's dimensions. So when when you click on a link it creates a new window and use writeln() methods to write a javascript function in the new window to resize itself. I understand that the resize function (which is triggered by a load event) won't run because the load happens before the script has been written. The line of code that i dont understand uses a close(); method that reloads the window instead of closing it. Here the script:
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
// Set the horizontal and vertical position for the popup
PositionX = 100; PositionY = 100;
// Set these value approximately 20 pixels greater than the size of the largest image to be used (for Netscape)
defaultWidth = 700; defaultHeight = 700;
// Set autoclose true to have the window close automatically or false to allow multiple popup windows
var AutoClose = true;
if (parseInt(navigator.appVersion.charAt(0))>=4){
var isNN=(navigator.appName=="Netscape")?1:0;
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}
var optNN='scrollbars=no,width='+defaultWidth+',height='+defaultHeight+',left='+PositionX+',top='+Positi onY;
var optIE='scrollbars=no,width=150,height=100,left='+PositionX+',top='+PositionY;
function popImage(imageURL,imageTitle){ //creates a new window and writes a script in it to resize itself
if (isNN){imgWin=window.open('about:blank','',optNN);}
if (isIE){imgWin=window.open('about:blank','',optIE);}
with (imgWin.document){ //shortens imgWin.document.writeln to writeln
writeln('<html><head><title>Loading...</title><style>body{margin:0px;}</style>');
writeln('<sc'+'ript>');
writeln('function reSizeToImage(){');
if (isIE){
writeln('window.resizeTo(100,100);');
writeln('width=(100-document.body.clientWidth)+document.images[0].width;');
writeln('height=(100-document.body.clientHeight)+document.images[0].height;');
writeln('window.resizeTo(width,height);}');}
else if(isNN){
writeln('window.innerWidth=document.images["myPic"].width;');
writeln('window.innerHeight=document.images["myPic"].height;}');
}
writeln('function doTitle(){document.title="'+imageTitle+'";}');
writeln('</sc'+'ript>');
writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()"')
if (!AutoClose){writeln('>')}else {writeln(' onblur="self.close()">');}
writeln('<img name="myPic" src='+imageURL+' style="display:block">');
writeln('</body></html>');
close(); //triggers new window to reload running resize script but i'm not sure why it works
}
}
</script>
</head>
<body>
<p><a href="javascript:popImage('image1.jpg','title')">View image1</a></p>
</body>
</html>
The script opens a new window with an image then resizes the window to match the image's dimensions. So when when you click on a link it creates a new window and use writeln() methods to write a javascript function in the new window to resize itself. I understand that the resize function (which is triggered by a load event) won't run because the load happens before the script has been written. The line of code that i dont understand uses a close(); method that reloads the window instead of closing it. Here the script:
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
// Set the horizontal and vertical position for the popup
PositionX = 100; PositionY = 100;
// Set these value approximately 20 pixels greater than the size of the largest image to be used (for Netscape)
defaultWidth = 700; defaultHeight = 700;
// Set autoclose true to have the window close automatically or false to allow multiple popup windows
var AutoClose = true;
if (parseInt(navigator.appVersion.charAt(0))>=4){
var isNN=(navigator.appName=="Netscape")?1:0;
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}
var optNN='scrollbars=no,width='+defaultWidth+',height='+defaultHeight+',left='+PositionX+',top='+Positi onY;
var optIE='scrollbars=no,width=150,height=100,left='+PositionX+',top='+PositionY;
function popImage(imageURL,imageTitle){ //creates a new window and writes a script in it to resize itself
if (isNN){imgWin=window.open('about:blank','',optNN);}
if (isIE){imgWin=window.open('about:blank','',optIE);}
with (imgWin.document){ //shortens imgWin.document.writeln to writeln
writeln('<html><head><title>Loading...</title><style>body{margin:0px;}</style>');
writeln('<sc'+'ript>');
writeln('function reSizeToImage(){');
if (isIE){
writeln('window.resizeTo(100,100);');
writeln('width=(100-document.body.clientWidth)+document.images[0].width;');
writeln('height=(100-document.body.clientHeight)+document.images[0].height;');
writeln('window.resizeTo(width,height);}');}
else if(isNN){
writeln('window.innerWidth=document.images["myPic"].width;');
writeln('window.innerHeight=document.images["myPic"].height;}');
}
writeln('function doTitle(){document.title="'+imageTitle+'";}');
writeln('</sc'+'ript>');
writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()"')
if (!AutoClose){writeln('>')}else {writeln(' onblur="self.close()">');}
writeln('<img name="myPic" src='+imageURL+' style="display:block">');
writeln('</body></html>');
close(); //triggers new window to reload running resize script but i'm not sure why it works
}
}
</script>
</head>
<body>
<p><a href="javascript:popImage('image1.jpg','title')">View image1</a></p>
</body>
</html>