Re: Find out the page dimensions

On Dec 1, 5:14 pm, Conrad Lender <crlen...@xxxxxxxxx> wrote:
On 2008-12-01 17:23, SAM wrote:

onload = function() {
var d = document.createElement('DIV');
d.style.height = document.body.offsetHeight + 'px';
d.style.width  = document.body.offsetWidth  + 'px';
d.style.position = 'absolute;
d.style.top = d.style..left = 0;
d.style.background = 'black';
d.title = 'click to close me';
d.onclick= function() { this.style.display='none'; };
document.body.appendChild(d);
}

Not tested !

David's right, this is neither syntactically correct, nor would it do

Except the FAQ doesn't have the exact example as he wants to cover the
document, not the viewport. Of course, the code above won't do that
either.

what the OP requires. Daniel, here's something to get you started; with
a few caveats:


 - I didn't have any older browsers around for testing; the function
should probably be improved to return something useful for them.

 - It uses browser sniffing. Yeah, I know. I'm going to get flamed for
this -- if anybody here knows a way to adjust the results for IE in
quirks mode with feature testing, that would be great.

See the FAQ viewport example.


 - It may not work if the body has a negative margin. If you need to
handle this case, you'll have to edit the function to account for it.

 - I didn't handle the height bug in Opera 9 in this example, there's a
test and workaround for that in the group FAQ.

There is? I remember talking about adding one, but I didn't know it
was changed.


That said, as far as I can see, it apperars to do the job in FF2, FF3,
IE6, IE7, Safari 3, Konqueror 3.5, and Opera 9 (if the body is higher
than the viewport).

var isMSIE;
/*@cc_on
    isMSIE = true;
@*/

See what the document.documentElement.clientWidth/Height properties
are in IE quirks mode (or IE < 6.) IIRC, they are 0. In that case,
use the scrollWidth/Height properties of the body, and otherwise use
the documentElement. There are other issues related to margins (on
the body in quirks mode, documentElement in standards mode.) Best to
avoid those at the design stage.

Also, make sure the expected properties are numbers.

[snip]
.

Relevant Pages

  • Re: FAQ Topic - How do I find the size of the window? (2009-12-23)
    ... FAQ Topic - How do I find the size of the window? ... Some environments will return the viewport height. ... In quirks mode, document.documentElement.clientHeight will return element height. ... Wherever possible try to use a standard. ...
    (comp.lang.javascript)
  • Re: Cross-Browser Client Size, Encore
    ... mode as well as in quirks mode. ... I've checked the following pages on Konqi and Opera, KDE, and MSIE6, ... You should really stop ragging on the example in the FAQ. ... than the viewport.) ...
    (comp.lang.javascript)
  • Re: FAQ Topic - How do I find the size of the window? (2011-11-08)
    ... FAQ Topic - How do I find the size of the window? ... find the dimensions of the viewport, ... Certain versions of KHTML, including Safari 2, have ... return the height and width of the viewport, ...
    (comp.lang.javascript)
  • Re: Error Saving New Risk in Project Server 2003
    ... Try posting on the server newsgroup as this one is closing down. ... FAQ Item: 24. ... I am having an issue when trying to save a new risk to a project ... function ActionsPaneCollapse_OnClick{var e = new Error; ...
    (microsoft.public.project.pro_and_server)
  • Re: FAQ Topic - How do I format a date with javascript? (2009-02-26)
    ... var year = padString+'', 4, '0'), ... There is no need to pad the Full Year in the FAQ; ... That's four times slower in FF3. ... Method setUTCFullYear will also set month, ...
    (comp.lang.javascript)