Need a div transition effect

Hi guys! I am looking for an open source javascript transition effect for a div but can’t find what i’m looking for.

Basically, and i’m pretty sure that there is one that exists, i am looking for it to do this.

1. Not visible state: the div content isnt visible.

SOME CONTENT
SOME OTHER CONTENT

2. Transitioning: the div content starts to appear, pushing the content below it down.

SOME CONTENT
part of the div
SOME OTHER CONTENT

3. The transition is finished, all the div is visible.

SOME CONTENT
all of the div
SOME OTHER CONTENT

my structure is like this:

<li>listItem</li>
<div id="whatever">
     <li>antother item</li>
     <li>antother item</li>
     <li>antother item</li>
</div>
<li>listItem< /li >
</li>

So i’d like to be able to apply a javascript effect to the div “whatever”. And i would also need the reverse of this effect.

I just can’t seem to find what i’m looking for, and i haven’t got enough javascript skills to create the transition effect myself.

Worst comes to the worst i’ll just stick with display:block and display:none.

Sam.