/    Sign up×
Community /Pin to ProfileBookmark

centered popup

Copy linkTweet thisAlerts:
Dec 27.2003

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

to post a comment
JavaScript

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@batfinkDec 27.2003 — 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>
Copy linkTweet thisAlerts:
@estilosauthorDec 28.2003 — 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?
Copy linkTweet thisAlerts:
@batfinkDec 28.2003 — In [b]your[/b] 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');[/quote]
Copy linkTweet thisAlerts:
@batfinkDec 28.2003 — 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;">
Copy linkTweet thisAlerts:
@estilosauthorDec 28.2003 — THANKS!

thats what i wanted!!

(sorry for not understanding the javascript)

?
Copy linkTweet thisAlerts:
@batfinkDec 28.2003 — No problem, glad you finally got the answer you wanted.
×

Success!

Help @estilos spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.28,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...