Access a <div> height value

Don Sutter

Hi all,

I'm using Javascript to try to determine the final height of a
division so that I can use that value in calculations to set the
height of another division and also my body height. I'm using the
term:

var foo = document.getElementById('contentFrame').style.heig ht;

to try to access the height value. Nothing seems to be returned. I can
set the height value to any arbitrary value I want, as in:

document.getElementById('contentFrame').style.heig ht = 700 + "px";

and the "contentFrame" division height is properly set.

I can't figure out what I'm doing wrong or if I'm even on the right
path. Can I even "get there" from here? Can I only access value(s) I
explicitly set?

Thanks in advance

Jul 23 '05 #1

Dominique

try this... but after you've populated or made a change to the DIV :0)

var foo = document.getElementById("contentFrame").offsetHeig ht

not sure if it'll work in all browsers, but its a start...

i'd guess your content frame needs to either scroll ur content if it exceeds
the window height, and also it should resize its height according to
whatever height is available...

if so, ur body height would come from -> window.document.body.offsetHeight

but ur content frame would then be the difference between ur body height and
the content above and below it

i won't go on, but ask if this helps and you need the rest of the
explanation lol*
good luck!

"Don Sutter" <no@way.com> wrote in message
news:34*****************@newsread2.news.pas.earthl ink.net...

Hi all,

I'm using Javascript to try to determine the final height of a
division so that I can use that value in calculations to set the
height of another division and also my body height. I'm using the
term:

var foo = document.getElementById('contentFrame').style.heig ht;

to try to access the height value. Nothing seems to be returned. I can
set the height value to any arbitrary value I want, as in:

document.getElementById('contentFrame').style.heig ht = 700 + "px";

and the "contentFrame" division height is properly set.

I can't figure out what I'm doing wrong or if I'm even on the right
path. Can I even "get there" from here? Can I only access value(s) I
explicitly set?

Thanks in advance

Jul 23 '05 #2

Don Sutter

Dominique,

offsetHeight didn't seem to make a difference. The page I'm working
on is at http://suntreeaz.com/en/flash/welcome(0).html. I'm want to
make the navigationFrame the same height as the contentFrame as well
as make the right side stripe go clear down to the bottom.

Don

"Dominique" <ni****@webadstudio.com> wrote in message
news:c7**********@ctb-nnrp2.saix.net...

try this... but after you've populated or made a change to the DIV :0)
var foo = document.getElementById("contentFrame").offsetHeig ht

not sure if it'll work in all browsers, but its a start...

i'd guess your content frame needs to either scroll ur content if it exceeds the window height, and also it should resize its height according to
whatever height is available...

if so, ur body height would come from -> window.document.body.offsetHeight
but ur content frame would then be the difference between ur body height and the content above and below it

i won't go on, but ask if this helps and you need the rest of the
explanation lol*
good luck!

"Don Sutter" <no@way.com> wrote in message
news:34*****************@newsread2.news.pas.earthl ink.net...

Hi all,

I'm using Javascript to try to determine the final height of a
division so that I can use that value in calculations to set the
height of another division and also my body height. I'm using the
term:

var foo = document.getElementById('contentFrame').style.heig ht;

to try to access the height value. Nothing seems to be returned. I can set the height value to any arbitrary value I want, as in:

document.getElementById('contentFrame').style.heig ht = 700 + "px";

and the "contentFrame" division height is properly set.

I can't figure out what I'm doing wrong or if I'm even on the right path. Can I even "get there" from here? Can I only access value(s) I explicitly set?

Thanks in advance

Jul 23 '05 #3

Chris

var foo=contentFrame.clientHeight
should do the trick for you...

the netscrape equiv being:
var foo=document.layers.contentFrame.innerHeight
At least... I believe it is, (never really could be buggered to code for NS
losers *ahem* erm... I mean users...)
And I believe mozilla will work with the IE version... once I was standards
compliant, coded for Mozilla, and IE... what happened to me..... oh yeah, I
got a sodding job!
"Don Sutter" <no@way.com> wrote in message
news:_D******************@newsread2.news.pas.earth link.net...

Dominique,

offsetHeight didn't seem to make a difference. The page I'm working
on is at http://suntreeaz.com/en/flash/welcome(0).html. I'm want to
make the navigationFrame the same height as the contentFrame as well
as make the right side stripe go clear down to the bottom.

Don

"Dominique" <ni****@webadstudio.com> wrote in message
news:c7**********@ctb-nnrp2.saix.net...

try this... but after you've populated or made a change to the DIV

:0)

var foo = document.getElementById("contentFrame").offsetHeig ht

not sure if it'll work in all browsers, but its a start...

i'd guess your content frame needs to either scroll ur content if it

exceeds

the window height, and also it should resize its height according to
whatever height is available...

if so, ur body height would come from ->

window.document.body.offsetHeight

but ur content frame would then be the difference between ur body

height and

the content above and below it

i won't go on, but ask if this helps and you need the rest of the
explanation lol*
good luck!

"Don Sutter" <no@way.com> wrote in message
news:34*****************@newsread2.news.pas.earthl ink.net...

Hi all,

I'm using Javascript to try to determine the final height of a
division so that I can use that value in calculations to set the
height of another division and also my body height. I'm using the
term:

var foo = document.getElementById('contentFrame').style.heig ht;

to try to access the height value. Nothing seems to be returned. I can set the height value to any arbitrary value I want, as in:

document.getElementById('contentFrame').style.heig ht = 700 + "px";

and the "contentFrame" division height is properly set.

I can't figure out what I'm doing wrong or if I'm even on the right path. Can I even "get there" from here? Can I only access value(s) I explicitly set?

Thanks in advance

Jul 23 '05 #4

Ron

Don Sutter wrote:

Hi all,

I'm using Javascript to try to determine the final height of a
division so that I can use that value in calculations to set the
height of another division and also my body height. I'm using the
term:

var foo = document.getElementById('contentFrame').style.heig ht;

to try to access the height value. Nothing seems to be returned. I can
set the height value to any arbitrary value I want, as in:

document.getElementById('contentFrame').style.hei ght = 700 + "px";

and the "contentFrame" division height is properly set.

I can't figure out what I'm doing wrong or if I'm even on the right
path. Can I even "get there" from here? Can I only access value(s) I
explicitly set?

Thanks in advance

Heya Don,
In addition to offsetHeight, you can get computed CSS values from the
defaultView property of the document object:

var myDiv = document.getElementById("contentFrame");
var myDivHeight = null;
if(document.implementation.hasFeature("CSS", "2.0")) {
myDivHeight = document.defaultView.getComputedStyle(myDiv,
null).getPropertyCSSValue("height").getStringValue (5);
}

will get you the height as a string in the form "nnpx". Learn more about
the DOM2 CSS interfaces at http://www.w3.org/TR/DOM-Level-2-Style .

Jul 23 '05 #5

Don Sutter

"Chris" <he**********@btinternet.com> wrote in message
news:c7**********@titan.btinternet.com...

var foo=contentFrame.clientHeight
should do the trick for you...

the netscrape equiv being:
var foo=document.layers.contentFrame.innerHeight
At least... I believe it is, (never really could be buggered to code for NS losers *ahem* erm... I mean users...)
And I believe mozilla will work with the IE version... once I was standards compliant, coded for Mozilla, and IE... what happened to me..... oh yeah, I got a sodding job!

Dang! I just hate it when that happens! (getting a sodding job, that
is)


"Don Sutter" <no@way.com> wrote in message
news:_D******************@newsread2.news.pas.earth link.net...

Dominique,

offsetHeight didn't seem to make a difference. The page I'm working on is at http://suntreeaz.com/en/flash/welcome(0).html. I'm want to make the navigationFrame the same height as the contentFrame as well as make the right side stripe go clear down to the bottom.

Don

"Dominique" <ni****@webadstudio.com> wrote in message
news:c7**********@ctb-nnrp2.saix.net...

try this... but after you've populated or made a change to the DIV

:0)

var foo = document.getElementById("contentFrame").offsetHeig ht

not sure if it'll work in all browsers, but its a start...

i'd guess your content frame needs to either scroll ur content

if it exceeds

the window height, and also it should resize its height

according to whatever height is available...

if so, ur body height would come from ->

window.document.body.offsetHeight

but ur content frame would then be the difference between ur body height and

the content above and below it

i won't go on, but ask if this helps and you need the rest of

the explanation lol*
good luck!

"Don Sutter" <no@way.com> wrote in message
news:34*****************@newsread2.news.pas.earthl ink.net...
> Hi all,
>
> I'm using Javascript to try to determine the final height of a
> division so that I can use that value in calculations to set the > height of another division and also my body height. I'm using the > term:
>
> var foo = document.getElementById('contentFrame').style.heig ht; >
> to try to access the height value. Nothing seems to be returned. I can

> set the height value to any arbitrary value I want, as in:
>
> document.getElementById('contentFrame').style.heig ht = 700 +

"px"; >
> and the "contentFrame" division height is properly set.
>
> I can't figure out what I'm doing wrong or if I'm even on the

right

> path. Can I even "get there" from here? Can I only access

value(s) I

> explicitly set?
>
> Thanks in advance
>
>

Jul 23 '05 #6

Don Sutter

"Ron" <we*******@slider142.com> wrote in message
news:76***********************@news4.srv.hcvlny.cv .net...

Don Sutter wrote:

Hi all,

I'm using Javascript to try to determine the final height of a
division so that I can use that value in calculations to set the
height of another division and also my body height. I'm using the
term:

var foo = document.getElementById('contentFrame').style.heig ht;

to try to access the height value. Nothing seems to be returned. I canset the height value to any arbitrary value I want, as in:

document.getElementById('contentFrame').style.hei ght = 700 + "px";

and the "contentFrame" division height is properly set.

I can't figure out what I'm doing wrong or if I'm even on the right
path. Can I even "get there" from here? Can I only access value(s) Iexplicitly set?

Thanks in advance

Heya Don,
In addition to offsetHeight, you can get computed CSS values from

the defaultView property of the document object:

var myDiv = document.getElementById("contentFrame");
var myDivHeight = null;
if(document.implementation.hasFeature("CSS", "2.0")) {
myDivHeight = document.defaultView.getComputedStyle(myDiv,
null).getPropertyCSSValue("height").getStringValue (5);
}

will get you the height as a string in the form "nnpx". Learn more about the DOM2 CSS interfaces at http://www.w3.org/TR/DOM-Level-2-Style .

Thanks for the best tip of all - RTM. I just wasn't sure where it was
but I should have known! Thanks

Jul 23 '05 #7