How to get this height info? Impossible?

M

Martin Honnen

Paul said:
Hi,
I'm wondering if someone out there can help me overcome this quandary.
I need to be able to calculate the height of the current page. I need to
calculate the height of the page in pixels after all images and text have
been displayed. This is the area that the visitor can 'scroll' up and down
in.
I have already calculated the height of the useable part of the browser
using:
document.body.clientHeight

Has anybody any ideas?
Is this possible?
Click to expand...

var docHeight;
if (typeof document.height != 'undefined') {
docHeight = document.height;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight = document.body.scrollHeight;
}
should work with NN4 and later and IE4 and later. Only problem is
IE6/Win in standards compliant mode where you need
document.documentElement.scrollHeight
so with some more checks
var docHeight;
if (typeof document.height != 'undefined') {
docHeight = document.height;
}
else if (document.compatMode && document.compatMode != 'BackCompat') {
docHeight = document.documentElement.scrollHeight;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight = document.body.scrollHeight;
}
 
P

Paul

Hi,
I'm wondering if someone out there can help me overcome this quandary.
I need to be able to calculate the height of the current page. I need to
calculate the height of the page in pixels after all images and text have
been displayed. This is the area that the visitor can 'scroll' up and down
in.
I have already calculated the height of the useable part of the browser
using:
document.body.clientHeight

Has anybody any ideas?
Is this possible?

Thank-you,

Paul
 
M

Martin Honnen

Paul said:
need to


Thanks for your suggestions but these methods aren't returning the actual
height of the page (the 'scrollable' height)

I know can use object.scrollHeight to retrieve the scrolling height of the
object:

http://www.msdn.microsoft.com/library/default.asp?url=/nhp/default.asp?contentid=28000441

But when I use:

document.write("document.body.scrollHeight is " +
document.body.scrollHeight);

It doesn't return the correct value.

Please see\try the html at the end of this post where I try many different
methods to get the value I want.

Thanks for any suggestions off anyone,

Paul
----------

<html>
<head>
<title>Example</title>
<SCRIPT TYPE="text/javascript">
<!--
function redo()
{
window.location.reload();
}
window.onresize = redo;
//-->
</SCRIPT>
<body>
<SCRIPT TYPE="text/javascript">
<!--
document.write("document.body.scrollHeight is " +
document.body.scrollHeight);
document.write("<br>document.body.clientHeight is " +
document.body.clientHeight);
document.write("<br>document.body.offsetHeight is " +
document.body.offsetHeight);
document.write("<br>document.body.clientHeight is " +
document.body.clientHeight);
document.write("<br>document.body.scrollHeight is " +
document.body.scrollHeight);
document.write("<br>document.documentElement.scrollHeight is " +
document.documentElement.scrollHeight);
document.write("<br>document.height is " + document.height);
document.write("<br>window.dialogHeight is " + window.dialogHeight);
document.write("<br>screen.height is " + screen.height);
document.write("<br>document.scrollHeight is " + document.scrollHeight);
var docHeight1;
if (typeof document.height != 'undefined') {
docHeight1 = document.height;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight1 = document.body.scrollHeight;
}
document.write("<br><br>docHeight1 is " + docHeight1);
var docHeight2;
if (typeof document.height != 'undefined') {
docHeight2 = document.height;
}
else if (document.compatMode && document.compatMode != 'BackCompat') {
docHeight2 = document.documentElement.scrollHeight;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight2 = document.body.scrollHeight;
}
document.write("<br>docHeight2 is " + docHeight2);
Click to expand...

Well, how do you suppose the browser can return the height of the
complete page here at this point where the complete page has not yet
been loaded. I still think you are looking for the value I suggested but
of course you should only read the value after the page has been loaded
and not while it loads.
 
P

Paul

Martin Honnen said:
var docHeight;
if (typeof document.height != 'undefined') {
docHeight = document.height;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight = document.body.scrollHeight;
}
should work with NN4 and later and IE4 and later. Only problem is
IE6/Win in standards compliant mode where you need
document.documentElement.scrollHeight
so with some more checks
var docHeight;
if (typeof document.height != 'undefined') {
docHeight = document.height;
}
else if (document.compatMode && document.compatMode != 'BackCompat') {
docHeight = document.documentElement.scrollHeight;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight = document.body.scrollHeight;
}
Click to expand...

Thanks for your suggestions but these methods aren't returning the actual
height of the page (the 'scrollable' height)

I know can use object.scrollHeight to retrieve the scrolling height of the
object:

http://www.msdn.microsoft.com/library/default.asp?url=/nhp/default.asp?contentid=28000441

But when I use:

document.write("document.body.scrollHeight is " +
document.body.scrollHeight);

It doesn't return the correct value.

Please see\try the html at the end of this post where I try many different
methods to get the value I want.

Thanks for any suggestions off anyone,

Paul
----------

<html>
<head>
<title>Example</title>
<SCRIPT TYPE="text/javascript">
<!--
function redo()
{
window.location.reload();
}
window.onresize = redo;
//-->
</SCRIPT>
<body>
<SCRIPT TYPE="text/javascript">
<!--
document.write("document.body.scrollHeight is " +
document.body.scrollHeight);
document.write("<br>document.body.clientHeight is " +
document.body.clientHeight);
document.write("<br>document.body.offsetHeight is " +
document.body.offsetHeight);
document.write("<br>document.body.clientHeight is " +
document.body.clientHeight);
document.write("<br>document.body.scrollHeight is " +
document.body.scrollHeight);
document.write("<br>document.documentElement.scrollHeight is " +
document.documentElement.scrollHeight);
document.write("<br>document.height is " + document.height);
document.write("<br>window.dialogHeight is " + window.dialogHeight);
document.write("<br>screen.height is " + screen.height);
document.write("<br>document.scrollHeight is " + document.scrollHeight);
var docHeight1;
if (typeof document.height != 'undefined') {
docHeight1 = document.height;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight1 = document.body.scrollHeight;
}
document.write("<br><br>docHeight1 is " + docHeight1);
var docHeight2;
if (typeof document.height != 'undefined') {
docHeight2 = document.height;
}
else if (document.compatMode && document.compatMode != 'BackCompat') {
docHeight2 = document.documentElement.scrollHeight;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight2 = document.body.scrollHeight;
}
document.write("<br>docHeight2 is " + docHeight2);
//-->
</SCRIPT>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
<p>Text to make the page longer in vertical height. Need to work out exactly
how long this is.</p>
</body>
</html>
 
P

Paul

Martin Honnen said:
Well, how do you suppose the browser can return the height of the
complete page here at this point where the complete page has not yet
been loaded. I still think you are looking for the value I suggested but
of course you should only read the value after the page has been loaded
and not while it loads.
Click to expand...

A good point, thanks.

When would be the best time to run this code? Considering that even
though the page has fully loaded, the images upon the page may not have been
loaded yet, and the height of the 'scrollable' size may change again.

A time delay would be undesirable.

This is what I have tried so far:

<html>
<head>
<title>Tamarish Art</title>
<SCRIPT TYPE="text/javascript">
<!--
function pageHeight()
{
var docHeight;
if (typeof document.height != 'undefined') {
docHeight = document.height;
}
else if (document.compatMode && document.compatMode != 'BackCompat') {
docHeight = document.documentElement.scrollHeight;
}
else if (document.body && typeof document.body.scrollHeight !=
'undefined') {
docHeight = document.body.scrollHeight;
}
}
window.onload = pageHeight;
//-->
</SCRIPT>
</head>
<body>
<SCRIPT TYPE="text/javascript">
<!--
document.write("Scrollable page height is " + docHeight);
//-->
</SCRIPT>
</body>
</html>

However, when I open the page, I get an error:
'docHeight' is undefined

Can you help me iron out these last few creases?

Thank-you very much for your help,

Paul
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Thumbnail Viewer adjusting 11
Help with Automatic Height Script 0
How to remove the undefined thing? 1
How to get actual <td> height after displaying (rendering) 8
How to decode this javascript? 19
How to determine page height once you've added elements? 0
HOW: Center this popup message on screen. 1
How to get tab height? 6

Members online

No members online now.
Total: 125 (members: 0, guests: 125)
Robots: 460

Forum statistics

Threads
473,888
Messages
2,569,964
Members
46,293
Latest member
BonnieHamb

Latest Threads

Top