So, I had a problem in this other trhead, which unfortunately there was no easy solution to. Luckily I found a similiar script that almost met all my requirements but one. When I choose to expand a div it doesn't expand as smoothly as this one. I am not particularly familiar with javascript and I'd be forever thankful if someone could add the code necessary for this particular operation.

Thanks a million in advance

Code:
<SCRIPT LANGUAGE="JavaScript">
<!--

visibleDiv = "";
function showHide(elementid){
    if (document.getElementById(elementid).style.display == 'none'){
        document.getElementById(elementid).style.display = '';
        if(visibleDiv != ""){
            document.getElementById(visibleDiv).style.display = 'none';
        }
        visibleDiv = elementid;


    } else {
        document.getElementById(elementid).style.display = 'none';
    }
}
//-->
</SCRIPT>
I also found this page which had some code for expanding the content smoothly. Perhaps it'd helpful?

Code:
function initMenus()
{
	if(!document.getElementsByTagName) return;
	
	slider = new Array();
	var divs = document.getElementsByTagName('div');

	for(var x=0; x<divs.length; x++)
	{
		divs[x].originalHeight = divs[x].offsetHeight;
		if(divs[x].className == 'menu') divs[x].speed = -1;
		if(divs[x].className == 'button') divs[x].onclick = function() { toggle(this); }
	}


	for(var x=0; x<divs.length; x++)
	{
		if(divs[x].className != 'menu') continue;
		divs[x].style.height = '1px';
		divs[x].style.display = 'none';
	}
	
}
Once again, thanks.