473,325 Members | 2,785 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

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

How to get this height info? Impossible?

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

Jul 20 '05 #1
4 12149


Paul wrote:
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?


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;
}

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 20 '05 #2
"Martin Honnen" <ma*******@yahoo.de> wrote in message
news:3f********@olaf.komtel.net...


Paul wrote:
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?


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;
}

--

Martin Honnen
http://JavaScript.FAQTs.com/


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/librar...entid=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.scrol lHeight 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>
Jul 20 '05 #3


Paul wrote:
"Martin Honnen" <ma*******@yahoo.de> wrote in message
news:3f********@olaf.komtel.net...

Paul wrote:

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?


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;
}


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/librar...entid=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.scrol lHeight 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);


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.

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 20 '05 #4

"Martin Honnen" <ma*******@yahoo.de> wrote in message
news:3f********@olaf.komtel.net...


Paul wrote:
"Martin Honnen" <ma*******@yahoo.de> wrote in message
news:3f********@olaf.komtel.net...

Paul wrote:
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?

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;
}


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/librar...entid=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.scrol lHeight 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);


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.

--

Martin Honnen
http://JavaScript.FAQTs.com/


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
Jul 20 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

157
by: Dennis | last post by:
Is there some way --using, say, DOM or javascript-- to detect the current pixel width and/or height of a relatively sized table or of one of its columns or rows. I'm going to be writing javascript...
2
by: Sina Tootoonian | last post by:
Hello everyone and thanks in advance. I am having a very simple but frustrating problem with IE 6.0. I have a style defined as: ..tooltip{ background-color:#FFFF99; font-family: Arial,...
1
by: UnderTaker | last post by:
Hi guys, I got a small problem which is driving me mad. I don't know if what I want to do is impossible or I am just overlooking something stupid, in both cases I hope you will answer me. I got...
5
by: Astra | last post by:
Hi All Is there an ASP way of extracting the height and width of a swf file so that I can specify these dims when adding the whole OBJECT code to the web page? Thanks Robbie
7
by: Arthur Dent | last post by:
I am completely baffled... i cannot for the life of me get the HEIGHT style to work on a table in the new 2005-supported XHTML. I put a HEIGHT: 100% on my table so that my footer row will also show...
13
by: Haines Brown | last post by:
I have a style for a list: dl { line-height: 1; margin-bottom: 1em; } But the W3C CSS validator says: Line: 124 Context : dl Invalid number : line-height Parse Error -
3
by: Prasad | last post by:
Hi , I am using a cross domain iframe in my page.. If i want to change the iframe height a/c to its content height , its giving Permission denied error as i am trying to access a function, which ...
3
by: =?iso-8859-1?q?Jesper_R=F8nn-Jensen?= | last post by:
I'm working with a requirement to make a selectbox the same height as normal text input elements. (at least for IE7) But in IE the selectbox reacts strangely to the CSS rules. Normally, there...
1
by: pravinnweb | last post by:
can anyone tell me how to set auto height to outer div that is in green box id "gray-background" it should increase relatively to inner div "smbox" here is the css and html code it should work in...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you

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.