Physical dimensions of a DIV container

[simplicity]

Is it possible to get / change current dimentions (I am specifically
interested in height) of the div container?

I have the element or variable height (accordion) that I want to
anchor to the bottom of the frame, so I am thinking about splitting
teh frame into into 2 divs, put accordion into the bottom one and
dynamically change the size of divs when the action is performed on
the accordion.

Can anyone give me a hint?

 

[slebetman]

Is it possible to get / change current dimentions (I am specifically
interested in height) of the div container?

I have the element or variable height (accordion) that I want to
anchor to the bottom of the frame, so I am thinking about splitting
teh frame into into 2 divs, put accordion into the bottom one and
dynamically change the size of divs when the action is performed on
the accordion.

/* Doesn't this do what you want?:
*/
var newHeight = 400;
var mydiv = document.getElementById('mydivID');
mydiv.style.height = newHeight + 'px'; /* note the px */

 

[simplicity]

/* Doesn't this do what you want?:
*/
var newHeight = 400;
var mydiv = document.getElementById('mydivID');
mydiv.style.height = newHeight + 'px'; /* note the px */

Not exactly. It is the a + b = c kind of problem, a, b and c being
heights of respective divs.

c is the current size of the div which contains a and b and changes on
window resize only,
a is the current size of the div containing accordion (bottom div),
its height in the style is set to auto,
b is height of the top div used to push a to the bottom.

I figured that when I perform the action on the accordion it will
change its height and, subsequently the height of div which contains
it (because it is "auto"). If I can read its new height and subtract
from current height of c I have the solution.

 

[Kailash Nadh]

Not exactly. It is the a + b = c kind of problem, a, b and c being
heights of respective divs.

c is the current size of the div which contains a and b and changes on
window resize only,
a is the current size of the div containing accordion (bottom div),
its height in the style is set to auto,
b is height of the top div used to push a to the bottom.

I figured that when I perform the action on the accordion it will
change its height and, subsequently the height of div which contains
it (because it is "auto"). If I can read its new height and subtract
from current height of c I have the solution.

You're lucky To get the exact height of an object in the viewport,
use the scrollHeight property.
So, in your case, you could get the height of c (auto) as

var c = document.getElementById('c').scrollHeight;
b = c-a; // that should be it

 

[Kailash Nadh]

simplicity said the following on 11/27/2007 5:24 PM:


Getting the height and setting the height are two entirely different
problems with entirely different solutions.

Just wondering, how does that statement help?

Hint: Try the group FAQ.

'Tried' the faq, but it said nothing about the 'scrollHeight'
property.