473,378 Members | 1,417 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,378 software developers and data experts.

Access a <div> height value

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
6 5454
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
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
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

"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
"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

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

Similar topics

44
by: Jim M | last post by:
I have had great success with using <iframe> with overflow-y set to auto. I can get a similar look with the <iframe> tag. BUT... In all cases I need to have fixed heights. Is there a way to...
3
by: Timmy | last post by:
For some reason IE6 does inserts a minimum default height of a div. I'm trying to set a height:1px; which works fine on Mozilla. Does anyone know how to get IE to display the same 1px div height? ...
1
by: P Nishanthan | last post by:
Hi, I have a datagrid inside the DIV. If the datagrid height is more than 100px, i have to show the scroll bar in the DIV. Otherwise DIV height should be same height as datagrid. How can i do...
4
by: Alan Silver | last post by:
Hello, Please pardon what is probably a dumb question, but if I have HTML like this... <div> <h3>Ferrets</h3> </div> and CSS like this...
1
by: Carl | last post by:
Hi all I have a javascript function that drags and drops an element (ie img) into a container (ie bordered div). The function works and returns the element and and container. My next step is to...
8
prino
by: prino | last post by:
Hi all, I've written code (in REXX) that takes files in legacy languages (PL/I, COBOL, z/OS assembler, etc) and converts them into HTML in a format similar to what's displayed in the z/OS ISPF...
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...
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...
0
by: ryjfgjl | last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

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.