How can i make my divs slide?

Hi guys

I have written a very basic javascript function which either displays or hides certain divs on my page, it does this instantly. However i heard somewhere that using javascript i can make these divs slide in and out. To be honest i dont really know where to start. Heres my script:

<script language="javascript">

var divs=['header', 'middle', 'footer'];

function displaydiv()
{

for (var x=0;x<divs.length;x++)
{
document.getElementById(divs[x]);
if (document.getElementById(divs[x]).style.display=='block')
{
document.getElementById(divs[x]).style.display='none';
}
else
{
document.getElementById(divs[x]).style.display='block';
}
}
}
</script>

Anyone know of any scripts that i can integrate into the above? If i could get it to work it would look great.

Cheers in advance

Will

 

This thread might help some: Show/Hide With a Slide : JavaScript