Comments on: Get document height (cross-browser)

By: CrAcKoFdAwN

CrAcKoFdAwN — Thu, 19 Nov 2009 23:17:29 +0000

Hi,
thx for this script! It works perfectly with IE 8 and Opera 10, but not with Firefox 3.5. It returns a height of about 30 pixels, even though the document’s height is 1000+ pixel.
Any idea?

By: RP

RP — Sun, 24 May 2009 20:54:44 +0000

Thank you for posting this. Surely solves a lot of my presentation issues being able to resize the containers dynamically based on content.

By: James Schend

James Schend — Fri, 15 May 2009 18:26:02 +0000

You can pass as many values as you want into Math.max(). Try this:

var db = document.body;
var dde = document.documentElement;
 
var docHeight = Math.max(db.scrollHeight, dde.scrollHeight, db.offsetHeight, dde.offsetHeight, db.clientHeight, dde.clientHeight)

By: Richard Harris

Richard Harris — Sat, 21 Mar 2009 19:30:30 +0000

Great piece of code James – nice,simple and comprehensive. Thanks and loving your work!

Any reason you didn’t use ‘document.height’ tho?

By: Ben Walker

Ben Walker — Thu, 19 Feb 2009 12:24:58 +0000

Thanks, James. That’s a wonderfully helpful little snippet (especially in jQuery). It just solved an IE6 jqModal overlay nightmare for me.

😉

By: Razvan

Razvan — Wed, 11 Feb 2009 14:54:58 +0000

Excellent !!! I call the function at the end of my html script and it works just fine. I have successfully tested also on Netscape 9 (Mozilla 5.0), even if I know it is at the end of his life.

By: casper

casper — Wed, 04 Feb 2009 14:46:50 +0000

Excellent!!

By: Dylan

Dylan — Wed, 14 Jan 2009 16:40:17 +0000

Any ideas how to get this into the css without flickering… (I believe the height is only known after the page has loaded)..

Nice code though, compliments, greets, Dylan

By: James

James — Tue, 06 Jan 2009 19:18:10 +0000

Actually in jQuery it’s a bit easier because it does most of the work for us:

$.getDocHeight = function(){
    return Math.max(
        $(document).height(),
        $(window).height(),
        /* For opera: */
        document.documentElement.clientHeight
    );
};

By: Joe McCann

Joe McCann — Tue, 06 Jan 2009 15:27:40 +0000

And for us jQuery junkies:

$.getDocHeight = function(){
     var D = document;
     return Math.max(Math.max(D.body.scrollHeight,    D.documentElement.scrollHeight), Math.max(D.body.offsetHeight, D.documentElement.offsetHeight), Math.max(D.body.clientHeight, D.documentElement.clientHeight));
};
 
alert( $.getDocHeight() );