Ascertain needed div height to fit content?

[Berko]

I have a javascript that manipulates the DOM with content that will be
of variable heights. How can I ascertain how high my div needs to be in
order to show all content without scroll bars. Rather than just having
this happen automatically, I want the div to expand with a DHTML
animation. So, I need to know where to tell the script to stop
expanding. In pseudo-code:

function divAni(){
if(this.height > 0){
if(this.height > 0){
this.height = this.height - increment;
}
setTimeout(divAni,delay)
} else {
if(this.height < this.height.needed){
this.height = this.height + increment
}
setTimeout(divAni,delay);
}
}

I'm just not sure how to ascertain how tall the div needs to be for the
content to display.

[Aaa aaa]

Berko wrote:

I have a javascript that manipulates the DOM with content that will be
of variable heights. How can I ascertain how high my div needs to be in
order to show all content without scroll bars. Rather than just having
this happen automatically, I want the div to expand with a DHTML
animation. So, I need to know where to tell the script to stop
expanding. In pseudo-code:

function divAni(){
if(this.height > 0){
if(this.height > 0){
this.height = this.height - increment;
}
setTimeout(divAni,delay)
} else {
if(this.height < this.height.needed){
this.height = this.height + increment
}
setTimeout(divAni,delay);
}
}

I'm just not sure how to ascertain how tall the div needs to be for the
content to display.

style.height = 'auto';

[Berko]

Aaa aaa wrote:

style.height = 'auto';

That would indeed work for general usage, but I want to animate the
div to display the content, i.e. I want to click on a div and then the
space under it will expand with animation to reveal the content. The
content is created via ajax calls to a web service.

Thanks for the response, but it's not exactly what I was looking for.

[Matt Kruse]

Berko wrote:

I'm just not sure how to ascertain how tall the div needs to be for
the content to display.

Load the content. Set visibility='hidden' and then display='block'.
Check the DIV's height.
Set the height to 0px and visibility=''
Now incrementally increase the div height until it matches the measured
height above.

For example, something like this:
http://mattkruse.com/temp/togglediv.html

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

[Berko]

Matt Kruse wrote:

Berko wrote:

I'm just not sure how to ascertain how tall the div needs to be for
the content to display.

Load the content. Set visibility='hidden' and then display='block'.
Check the DIV's height.
Set the height to 0px and visibility=''
Now incrementally increase the div height until it matches the measured
height above.

For example, something like this:
http://mattkruse.com/temp/togglediv.html

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

Thanks, Matt, this is exactly what I was looking to do!