Expandable List Boxes

Savahn

This may be a little too advanced to ask, but I will ask it anyway. I am trying to create an expandable list colomn similar to <ul><li>, but I want a plus sign so that the user can select which month to expand. I.E.

 + January
      - Item 1
      - Item 2
      - Item 3
 + December
      - Item 1
      - Item 2
      - Item 3

The items listed in each month will be data from a MySQL database. How do I make the list? I will be able to figure out how to get the data into the list once I have created it, but I have no idea on how to go about writing the code to get the list to display properly.

msound

I use css and javascript for this.
Head tag:

<style>
.HideText {
	display: none;
}

.ShowText {
	display: block;
}
</style>

<script type="text/javascript">
function changeDisplay(id) {
	var div = document.getElementById(id);
	if(div.className=='HideText'){
		div.className='ShowText';
	}else{
		div.className='HideText';
	}
	return(false);
}
</script>

Down in the body where you want the expand and collapse effect:

<div id="content1" class="HideText">
expandable content
</div>

<a href="#" onClick="return(changeDisplay('content1'))">toggle view</a>

Here's an example from one of my site projects: http://www.groupspotter.com/
Just click on the "Search for Groups" link and you'll see how it works. The only thing you'll have left to do is an image swap between a "+" and a "-". But you could tie that into the javascript in your head tag.

Savahn

Thanks for the help. Don't really need the + and - for this project. I just code, someone else is gonna make it pretty =) I found another example on the net else where but yours is by far half the code of the others I have scene.