Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

ppc_michael

Guest
Original poster
Apr 26, 2005
1,498
2
Los Angeles, CA
I'm building an ajax-y search form. As the user types, the results are displayed (Google Suggestions-ish). That part is working properly, so now I'm adding little animations with jQuery. This is where my question comes in:

I would like to animate the <div> containing the search results to vertically expand to accomodate the incoming results, then fade in the results.

So, is there a way to calculate the vertical height of the search results list (a <ul>) before displaying it, so that I know what height to animate the <div> to before the <ul> fades in?
 
A partial thought on this. You can use the CSS property "visibility" or "opacity' to have the content there, but not visible, then fade in. The elements will still take up their same space in the layout, just not viewable.

Then with jQuery you can use the height() function on it.
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.