471,122 Members | 2,437 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,122 software developers and data experts.

How to make popup *just* big enough?



My JavaScript code opens a popup window which contains some text
(with hyperlinks), and some buttons. I want this popup to be *as
small as possible*, while still showing all of its contents. Is
there any way to determine this size dynamically that will work
for all "reasonably recent" browsers (e.g. IE 6, NS 6, etc. or
newer)?

TIA,

jill

--
To s&e^n]d me m~a}i]l r%e*m?o\v[e bit from my a|d)d:r{e:s]s.

Jul 23 '05 #1
5 1548
In article <cd**********@reader2.panix.com>, jk*********@yahbitoo.com
enlightened us with...

My JavaScript code opens a popup window which contains some text
(with hyperlinks), and some buttons. I want this popup to be *as
small as possible*, while still showing all of its contents. Is
there any way to determine this size dynamically that will work
for all "reasonably recent" browsers (e.g. IE 6, NS 6, etc. or
newer)?

Before it opens? No. You don't know what my font size is set to if I
override yours, which many visually impaired people do. You have no way
to tell if I have my browser set to ignore your style sheet.

After it opens? You'd have to play around and then resize the window.
Resizing has many drawbacks, including problems with tabbed browsers and
browsers with resize turned off.

All that assumes your popup isn't blocked.

--
--
~kaeli~
Those who get too big for their britches will be exposed in
the end.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #2
In <MP************************@nntp.lucent.com> kaeli <ti******@NOSPAM.comcast.net> writes:
In article <cd**********@reader2.panix.com>, jk*********@yahbitoo.com
enlightened us with...

My JavaScript code opens a popup window which contains some text
(with hyperlinks), and some buttons. I want this popup to be *as
small as possible*, while still showing all of its contents. Is
there any way to determine this size dynamically that will work
for all "reasonably recent" browsers (e.g. IE 6, NS 6, etc. or
newer)?
After it opens? You'd have to play around and then resize the window.


But how do I determine what to resize the window to? (I guess I
don't understand what you mean by "play around"; I'm a bit of a
newbie when it comes to JavaScript...).

jill
--
To s&e^n]d me m~a}i]l r%e*m?o\v[e bit from my a|d)d:r{e:s]s.

Jul 23 '05 #3
In article <cd**********@reader2.panix.com>, jk*********@yahbitoo.com
enlightened us with...
After it opens? You'd have to play around and then resize the window.


But how do I determine what to resize the window to? (I guess I
don't understand what you mean by "play around"; I'm a bit of a
newbie when it comes to JavaScript...).


Sorry, I tend to be overly vague sometimes. *heh*

By play around, I mean you'd have to try a few methods to see what
worked, because I don't know of any easy way to get the size. ;)

An idea, untested: hack your content a bit by sticking it all in a div
that is set to take up all available space, but can overflow the window
size, then get the height and width of the div if you can (browser-
dependent), then resize the window to the height and width of the div.

I don't think you can get the height of the body element itself, but you
can try. You could also try getting the document size and see if that's
it. If you can get those, I don't know if they'd give you the height and
width you'd be looking for.

--
--
~kaeli~
You feel stuck with your debt if you can't budge it.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #4
In article <MP************************@nntp.lucent.com>,
ti******@NOSPAM.comcast.net enlightened us with...

An idea, untested: hack your content a bit by sticking it all in a div
that is set to take up all available space, but can overflow the window
size, then get the height and width of the div if you can (browser-
dependent), then resize the window to the height and width of the div.

I don't think you can get the height of the body element itself, but you
can try. You could also try getting the document size and see if that's
it. If you can get those, I don't know if they'd give you the height and
width you'd be looking for.


I decided to play a bit and the div idea didn't work too well in NN/Moz,
so I've gotten this far with window values. The values aren't the
greatest and more needs to be done to size properly for NN/IE, but it's
a start. Note that NN and IE come up with different numbers for the
height and the height in IE doesn't take the top of the window into
account, so it's too small a window by that amount, which will vary
system to system.

Others I tried already that didn't work well:
win.document.body.offsetHeight: IE worked, NN always had 0
win.innerHeight: NN worked, IE=undefined

win.document.body.clientHeight; // IE same as OH, NN same as IH, so
kept this

Have fun. I have to go home now.

--------------test.html---------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title> New Document </title>
<script type="text/javascript" language="javascript">
function openIt()
{
var win = window.open("test2.html","","height=200,width=200" );
var ch = win.document.body.clientHeight;
var cw = win.document.body.clientWidth;

alert("clientHeight: "+ch+"\n"+
"clientWidth: "+cw);
//win.resizeTo(w,h);
//win.focus();
}
</script>
</head>

<body>
<form id="f1" name="f1">
<br>
<input type="button" name="btn1" value="try it" id="btn1"
onclick="openIt()">
</form>
</body>
</html>

--------------test2.html---------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title>test </title>
<style type="text/css">
body {
height: 100%;
width: 100%;
}
</style>
</head>

<body>
<p>this is the start of the content.</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is the end of the content.</p>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
<head>
<title>test </title>
<style type="text/css">
body {
height: 100%;
width: 100%;
}
</style>
</head>

<body>
<p>this is the start of the content.</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is test page #2</p>
<p>this is the end of the content.</p>
</body>
</html>

--
--
~kaeli~
If you don't pay your exorcist, you get repossessed.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #5
J Krugman wrote:


My JavaScript code opens a popup window which contains some text
(with hyperlinks), and some buttons. I want this popup to be *as
small as possible*, while still showing all of its contents. Is
there any way to determine this size dynamically that will work
for all "reasonably recent" browsers (e.g. IE 6, NS 6, etc. or
newer)?

TIA,

jill


Hi Jill

AFAIK: I don't think so.
The problem you face is that people can have all kind of fontsizes because
they have bad eyes or something like that. (eg fontsize=150%)

You don't have to have bad eyes even:
I have a highres monitor (21'') and often set my fontsize on Mozilla to 150%
when I hit a side where some (bad) webdesigners use an impossible small
font.

You could try to override the settings, but that is rude and very unfriendly
for that users with bad eyes.

So: In my opinion the most reasonable solution is this: Create a pop-up and
make it big enough for 100% textsize on both M$ Exploder and NS/Mozilla.
But make sure you do not add missery like 'noresize'.
That way it looks good for most people, but you also give people the
oppertunity to change your default.

Regards,
Erwin Moller
Jul 23 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

38 posts views Thread by Shaun McKinnon | last post: by
1 post views Thread by amith | last post: by
26 posts views Thread by Raffi | last post: by
23 posts views Thread by Markus | last post: by
4 posts views Thread by Richard | last post: by
5 posts views Thread by Thelma Roslyn Lubkin | last post: by
11 posts views Thread by V S Rawat | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.