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.getEle mentById('conte ntFrame').style .height;

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.getEle mentById('conte ntFrame').style .height = 700 + "px";

and the "contentFra me" 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

[Dominique]

Re: Access a &lt;div&gt; height value

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

var foo = document.getEle mentById("conte ntFrame").offse tHeight

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.offsetHei ght

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:34zmc.9987 $Hs1.2151@newsr ead2.news.pas.e arthlink.net...[color=blue]
> 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.getEle mentById('conte ntFrame').style .height;
>
> 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.getEle mentById('conte ntFrame').style .height = 700 + "px";
>
> and the "contentFra me" 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
>
>[/color]

[Don Sutter]

Re: Access a &lt;div&gt; height value

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" <niques@webadst udio.com> wrote in message
news:c7efjq$ntu $1@ctb-nnrp2.saix.net. ..[color=blue]
> try this... but after you've populated or made a change to the DIV[/color]
:0)[color=blue]
>
> var foo = document.getEle mentById("conte ntFrame").offse tHeight
>
> 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[/color]
exceeds[color=blue]
> the window height, and also it should resize its height according to
> whatever height is available...
>
> if so, ur body height would come from ->[/color]
window.document .body.offsetHei ght[color=blue]
>
> but ur content frame would then be the difference between ur body[/color]
height and[color=blue]
> 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:34zmc.9987 $Hs1.2151@newsr ead2.news.pas.e arthlink.net...[color=green]
> > 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.getEle mentById('conte ntFrame').style .height;
> >
> > to try to access the height value. Nothing seems to be returned. I[/color][/color]
can[color=blue][color=green]
> > set the height value to any arbitrary value I want, as in:
> >
> > document.getEle mentById('conte ntFrame').style .height = 700 + "px";
> >
> > and the "contentFra me" division height is properly set.
> >
> > I can't figure out what I'm doing wrong or if I'm even on the[/color][/color]
right[color=blue][color=green]
> > path. Can I even "get there" from here? Can I only access value(s)[/color][/color]
I[color=blue][color=green]
> > explicitly set?
> >
> > Thanks in advance
> >
> >[/color]
>
>[/color]

[Chris]

Re: Access a &lt;div&gt; height value

var foo=contentFram e.clientHeight
should do the trick for you...

the netscrape equiv being:
var foo=document.la yers.contentFra me.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:_Dzmc.1001 9$Hs1.4983@news read2.news.pas. earthlink.net.. .[color=blue]
> 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" <niques@webadst udio.com> wrote in message
> news:c7efjq$ntu $1@ctb-nnrp2.saix.net. ..[color=green]
> > try this... but after you've populated or made a change to the DIV[/color]
> :0)[color=green]
> >
> > var foo = document.getEle mentById("conte ntFrame").offse tHeight
> >
> > 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[/color]
> exceeds[color=green]
> > the window height, and also it should resize its height according to
> > whatever height is available...
> >
> > if so, ur body height would come from ->[/color]
> window.document .body.offsetHei ght[color=green]
> >
> > but ur content frame would then be the difference between ur body[/color]
> height and[color=green]
> > 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:34zmc.9987 $Hs1.2151@newsr ead2.news.pas.e arthlink.net...[color=darkred]
> > > 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.getEle mentById('conte ntFrame').style .height;
> > >
> > > to try to access the height value. Nothing seems to be returned. I[/color][/color]
> can[color=green][color=darkred]
> > > set the height value to any arbitrary value I want, as in:
> > >
> > > document.getEle mentById('conte ntFrame').style .height = 700 + "px";
> > >
> > > and the "contentFra me" division height is properly set.
> > >
> > > I can't figure out what I'm doing wrong or if I'm even on the[/color][/color]
> right[color=green][color=darkred]
> > > path. Can I even "get there" from here? Can I only access value(s)[/color][/color]
> I[color=green][color=darkred]
> > > explicitly set?
> > >
> > > Thanks in advance
> > >
> > >[/color]
> >
> >[/color]
>
>[/color]

[Ron]

Re: Access a &lt;div&gt; height value

Don Sutter wrote:
[color=blue]
>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.getEle mentById('conte ntFrame').style .height;
>
>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.getEl ementById('cont entFrame').styl e.height = 700 + "px";
>
>and the "contentFra me" 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
>
>
>
>[/color]
Heya Don,
In addition to offsetHeight, you can get computed CSS values from the
defaultView property of the document object:

var myDiv = document.getEle mentById("conte ntFrame");
var myDivHeight = null;
if(document.imp lementation.has Feature("CSS", "2.0")) {
myDivHeight = document.defaul tView.getComput edStyle(myDiv,
null).getProper tyCSSValue("hei ght").getString Value(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 .

[Don Sutter]

Re: Access a &lt;div&gt; height value


"Chris" <herakles_uk1@b tinternet.com> wrote in message
news:c7elfr$g9b $1@titan.btinte rnet.com...[color=blue]
> var foo=contentFram e.clientHeight
> should do the trick for you...
>
> the netscrape equiv being:
> var foo=document.la yers.contentFra me.innerHeight
> At least... I believe it is, (never really could be buggered to code[/color]
for NS[color=blue]
> losers *ahem* erm... I mean users...)
> And I believe mozilla will work with the IE version... once I was[/color]
standards[color=blue]
> compliant, coded for Mozilla, and IE... what happened to me..... oh[/color]
yeah, I[color=blue]
> got a sodding job!
>[/color]

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

[color=blue]
>
> "Don Sutter" <no@way.com> wrote in message
> news:_Dzmc.1001 9$Hs1.4983@news read2.news.pas. earthlink.net.. .[color=green]
> > Dominique,
> >
> > offsetHeight didn't seem to make a difference. The page I'm[/color][/color]
working[color=blue][color=green]
> > on is at http://suntreeaz.com/en/flash/welcome(0).html. I'm want[/color][/color]
to[color=blue][color=green]
> > make the navigationFrame the same height as the contentFrame as[/color][/color]
well[color=blue][color=green]
> > as make the right side stripe go clear down to the bottom.
> >
> > Don
> >
> > "Dominique" <niques@webadst udio.com> wrote in message
> > news:c7efjq$ntu $1@ctb-nnrp2.saix.net. ..[color=darkred]
> > > try this... but after you've populated or made a change to the[/color][/color][/color]
DIV[color=blue][color=green]
> > :0)[color=darkred]
> > >
> > > var foo = document.getEle mentById("conte ntFrame").offse tHeight
> > >
> > > 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[/color][/color][/color]
if it[color=blue][color=green]
> > exceeds[color=darkred]
> > > the window height, and also it should resize its height[/color][/color][/color]
according to[color=blue][color=green][color=darkred]
> > > whatever height is available...
> > >
> > > if so, ur body height would come from ->[/color]
> > window.document .body.offsetHei ght[color=darkred]
> > >
> > > but ur content frame would then be the difference between ur[/color][/color][/color]
body[color=blue][color=green]
> > height and[color=darkred]
> > > the content above and below it
> > >
> > > i won't go on, but ask if this helps and you need the rest of[/color][/color][/color]
the[color=blue][color=green][color=darkred]
> > > explanation lol*
> > > good luck!
> > >
> > > "Don Sutter" <no@way.com> wrote in message
> > > news:34zmc.9987 $Hs1.2151@newsr ead2.news.pas.e arthlink.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[/color][/color][/color]
the[color=blue][color=green][color=darkred]
> > > > height of another division and also my body height. I'm using[/color][/color][/color]
the[color=blue][color=green][color=darkred]
> > > > term:
> > > >
> > > > var foo =[/color][/color][/color]
document.getEle mentById('conte ntFrame').style .height;[color=blue][color=green][color=darkred]
> > > >
> > > > to try to access the height value. Nothing seems to be[/color][/color][/color]
returned. I[color=blue][color=green]
> > can[color=darkred]
> > > > set the height value to any arbitrary value I want, as in:
> > > >
> > > > document.getEle mentById('conte ntFrame').style .height = 700 +[/color][/color][/color]
"px";[color=blue][color=green][color=darkred]
> > > >
> > > > and the "contentFra me" division height is properly set.
> > > >
> > > > I can't figure out what I'm doing wrong or if I'm even on the[/color]
> > right[color=darkred]
> > > > path. Can I even "get there" from here? Can I only access[/color][/color][/color]
value(s)[color=blue][color=green]
> > I[color=darkred]
> > > > explicitly set?
> > > >
> > > > Thanks in advance
> > > >
> > > >
> > >
> > >[/color]
> >
> >[/color]
>
>[/color]

[Don Sutter]

Re: Access a &lt;div&gt; height value

"Ron" <webmaster@slid er142.com> wrote in message
news:76Bmc.1532 99$Gd3.39815305 @news4.srv.hcvl ny.cv.net...[color=blue]
> Don Sutter wrote:
>[color=green]
> >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.getEle mentById('conte ntFrame').style .height;
> >
> >to try to access the height value. Nothing seems to be returned. I[/color][/color]
can[color=blue][color=green]
> >set the height value to any arbitrary value I want, as in:
> >
> >document.getEl ementById('cont entFrame').styl e.height = 700 + "px";
> >
> >and the "contentFra me" 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)[/color][/color]
I[color=blue][color=green]
> >explicitly set?
> >
> >Thanks in advance
> >
> >
> >
> >[/color]
> Heya Don,
> In addition to offsetHeight, you can get computed CSS values from[/color]
the[color=blue]
> defaultView property of the document object:
>
> var myDiv = document.getEle mentById("conte ntFrame");
> var myDivHeight = null;
> if(document.imp lementation.has Feature("CSS", "2.0")) {
> myDivHeight = document.defaul tView.getComput edStyle(myDiv,
> null).getProper tyCSSValue("hei ght").getString Value(5);
> }
>
> will get you the height as a string in the form "nnpx". Learn more[/color]
about[color=blue]
> the DOM2 CSS interfaces at http://www.w3.org/TR/DOM-Level-2-Style .[/color]

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