jQuery - Animated Collapsible DIV, sliding up?

Question

I'm using this jQuery script to animate a div to open/close when the user clicks a button: http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm

Is there any way to make it slide up, instead of down?

What I mean is: Instead of the DIV opening downwards (extending the area below it), is it possible for it to extend the content on top of it, so that it doesnt extend downwards?

Blarh, I'm finding it hard to describe.

Example:

Before:
1###TOP OF PAGE###
2#################
3#################
4#################
5#################
6######BUTTON#####
7###HIDDEN DIV####
8##BOTTOM OF PAGE#

After:
1###TOP OF PAGE###
2#################
3######BUTTON#####
4#####OPEN DIV####
5####CONTENT######
6####CONTENT######
7####CONTENT######
8##BOTTOM OF PAGE#

Instead of like this, as default:
1###TOP OF PAGE###
2#################
3#################
4#################
5#################
6######BUTTON#####
7#####OPEN DIV####
8####CONTENT######
9####CONTENT######
10###CONTENT######
11#BOTTOM OF PAGE#

Sorry for my crappy explanation, but I hope you understand :P

Thanks!

Answer 1

you can use JQuery slideUp to hide an element or JQuery slideDown to display an element
also you can use JQuery slideToggle to toggle the element

and this is an example