Click to See Complete Forum and Search --> : centered popup


estilos
12-27-2003, 03:09 PM
hi, I have this function that creates a popup based on the title, image, width and height that I define in the link

var ImgWin=" "
function imgwin(Imgn,w,h,imgTitle){
if(ImgWin.open) {ImgWin.close()}
winprops="width="+w+",height="+h+",crollbars=no,resizable=no,top=0,left=0"
ImgWin=window.open("","winimg",config=winprops);
ImgWin.document.writeln('<html><head><title>'+imgTitle+'</title><style>body{margin:3px;}</style>')
ImgWin.document.write("<img src="+Imgn+">")
ImgWin.document.close()
ImgWin.focus()
}

onClick="imgWin('image.jpg',232,502,'title');return false;">

how can I make the popup centered? Iīve tried but canīt do it and i need this code very much!! please help, thanks

batfink
12-27-2003, 05:37 PM
there are two ways to center the popup window. With the top and left whilst declaring the window properties, or after the window is created just center it with moveTo() method.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript" language="javascript">
function winny()
{
awidth = 400;
aheight = 200;
var winw = (screen.width-awidth)/2;
var winh = (screen.height-aheight)/2;
window.open("",'hello',"menubar=yes,height="+aheight+",width=" + awidth + ",left=" + winw + ",top=" + winh);
}
</script>
</head>
<body>
<form name="form1">
<input type="button" value="Open a centered window" onClick="winny()">
</form>
</body>
</html>

SECOND WAY:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript" language="javascript">
function winny()
{
awidth = 400;
aheight = 200;
var winw = (screen.width-awidth)/2;
var winh = (screen.height-aheight)/2;
mywin = window.open("",'hello',"menubar=yes,height="+aheight+",width=" + awidth);
mywin.moveTo(winw,winh);
}
</script>
</head>
<body>
<form name="form1">
<input type="button" value="Open a centered window" onClick="winny()">
</form>
</body>
</html>

estilos
12-28-2003, 08:24 AM
thanks but I donīt javascript very well, how do I put those functions into my function? I think the width and height canīt be predefined because I have a lot of thumbnails and for every "bigger image" there are specific measures... how can I have a centered popup based on the function I already have?? anyone knows?

batfink
12-28-2003, 01:01 PM
In your example you have predefined the width and height as you have passed them to the function imgwin()
So what do you want?
imgWin('image.jpg',232,502,'title');

batfink
12-28-2003, 01:05 PM
This will do the hob using your function:

var ImgWin=" "
function imgwin(Imgn,w,h,imgTitle){
var winw = (screen.width-w)/2;
var winh = (screen.height-h)/2;
if(ImgWin.open) {ImgWin.close()}
winprops="width="+w+",height="+h+",crollbars=no,resizable=no,top="+winh+",left="+winw+"
ImgWin=window.open("","winimg",config=winprops);
ImgWin.document.writeln('<html><head><title>'+imgTitle+'</title><style>body{margin:3px;}</style>')
ImgWin.document.write("<img src="+Imgn+">")
ImgWin.document.close()
ImgWin.focus()
}

onClick="imgWin('image.jpg',232,502,'title');return false;">

estilos
12-28-2003, 01:24 PM
THANKS!
thats what i wanted!!
(sorry for not understanding the javascript)
:)

batfink
12-28-2003, 01:34 PM
No problem, glad you finally got the answer you wanted.