Center popup on screen, with a twist!

Untitled

03-19-2004, 11:29 PM

With the following code, you have to set a horizontal and vertical screen postition, but i'd like to have it center on the screen, regardless of the screen size. Is this possible, and if so, how?

Thank You for your help.

<script>

// 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 (needed for Netscape)

defaultWidth = 500;
defaultHeight = 500;

// Set autoclose true to have the window close automatically
// Set autoclose false to allow multiple popup windows

var AutoClose = true;

// Do not edit below this line...
// ================================
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){
if (isNN){imgWin=window.open('about:blank','',optNN);}
if (isIE){imgWin=window.open('about:blank','',optIE);}
with (imgWin.document){
writeln('<html><head><title>Loading...</title><style>body{margin:0px;}</style>');writeln('<sc'+'ript>');
writeln('var isNN,isIE;');writeln('if (parseInt(navigator.appVersion.charAt(0))>=4){');
writeln('isNN=(navigator.appName=="Netscape")?1:0;');writeln('isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}');
writeln('function reSizeToImage(){');writeln('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);}');writeln('if (isNN){');
writeln('window.innerWidth=document.images["George"].width;');writeln('window.innerHeight=document.images["George"].height;}}');
writeln('function doTitle(){document.title="'+imageTitle+'";}');writeln('</sc'+'ript>');
if (!AutoClose) writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()">')
else writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()" onblur="self.close()">');
writeln('<img name="George" src='+imageURL+' style="display:block"></body></html>');
close();
}}

</script>

liorean

03-19-2004, 11:34 PM

Try using these properties:

screen.availWidth - what width is usable
screen.availHeight - what height is usable
screen.availLeft - what distance from the left edge the usable screen area begins
screen.availTop - what distance from the top edge the usable screen area begins

Untitled

03-19-2004, 11:40 PM

How exactly would I use these parameters? Just put them in here, like so?

PositionX = screen.availWidth;
PositionY = screen.availHeight;

Thanks

liorean

03-19-2004, 11:46 PM

You need to do a little bit more math than that...

posTop=((screen.availHeight-popupHeight)/2)+screen.availTop;
posLeft=((screen.availWidth-popupWidth)/2)+screen.availLeft;

Untitled

03-20-2004, 12:01 AM

I put it in exactly as shown below, and I got an error, then another one. I'm probably doing something wrong. Please help!

<script>

// Set the horizontal and vertical position for the popup

posTop=((screen.availHeight-popupHeight)/2)+screen.availTop;
posLeft=((screen.availWidth-popupWidth)/2)+screen.availLeft;

ETC...

liorean

03-20-2004, 12:11 AM

popupHeight and popupWidth should either be real variables or the corresponding values that you want. I would guess you haven't defined them.

Untitled

03-20-2004, 12:17 AM

There is this little tid bit:

defaultWidth = 500;
defaultHeight = 500;

But I have multiple popups, of different sizes, so i don't know what I can define safely?