.hide() sets the CSS style display:none. This takes the element out of the
layout, so in effect its height and width are treated as if they were 0. The
height and width don't actually change; you can set display:block or .show()
to have the element displayed in its original size.
If a parent element's height depends on the child element's height (i.e. the
parent does not have an explicit height: style of its own), then it will
adjust accordingly. .height() does work on the parent element, but it's
reporting the element's newly recalculated height (without the child
element).
If you want an element to become invisible but remain part of the layout,
then set .attr({visibility:'hidden'}) instead of using .hide(). Use
.attr({visibility:'visible'}) to display it again.
-Mike
> -----Original Message-----
> From: jquery-en@googlegroups.com
> [mailto:jquery...@googlegroups.com] On Behalf Of jquertil
> Sent: Friday, January 16, 2009 4:36 PM
> To: jQuery (English)
> Subject: [jQuery] .hide() and .height()
>
>
> I noticed today after much fiddling that .hide() causes the
> parent element to loose its height().
>
> In other words, height() won't work on elements that have display:none
> -- causing me to use .hide() only AFTER I've done my
> .height() - based calculations.
>
> I suppose that makes sense but I somehow never really thought
> that element.height is an attribute that gets set to 0 if
> display:is set to none...or whatever is actually going on.
>
