help with slider script

[tyutghf]

The navigation down the left hand side of my site is getting very long so I want to have opnly the headers visible on page load but then expand each heading to show further links.

Here is the sort of thig I am after

http://www.dhtmlgoodies.com/scripts/show-hide-content-slide/show-hide-content-slide.html

All examples like this one I have found is based upon div tags but the whole left navigation on my site is held in ul and li tags as in the code below

<ul id="navigation">
      <li><a href="go.html" title=''>standard</a></li>
      
      <li class='nochange'><a href="go.html" title=''>Click to open</a>
      <ul>
      <li><a href="go.html" title=''>sublink</a></li>
      </ul>
      </li>
      
      <li class='nochange'><a href='' title=''>Click to open</a>
      <ul>
						<li><a href='go.html'>sub link 1</a></li>
      <li><a href='go.html'>sub link 2</a></li>
      </ul>
      </li>      
      
    </ul>

So the first link has no sub level and will go straight to the page.
The click to open does have sub links so open the slider.

I have spent many an hour trying to modify the example to work with my current structure without luck. I know the meaty bit is the getElementsByTagName('DIV'), can someone help please?

 

[feherke]

Hi

I would search for "javascript accordion" and pick a suitable one. jQuery - Horizontal Accordion looks good.

Feherke.

http://rootshell.be/~feherke/

 

[vicvirk]

the other alternative is to toggle the display of the sub elements - you'll need to add an ID to each <ul> and originaly set it to "none"

<a href="[b]javascript:toggle([u]1[/u]);[/b]">Click To Open</a>
<ul id="list_[u]1[/u]" style="display:none;">
<li>List Item 1</li>
<li>List Item 2</li>
</ul>
<script language="javascript">
function toggle(listNum) {
	var listBlock = document.getElementById("list_" + listNum)
	if (listBlock.style.display == "none")
		listBlock.style.display = "block";
	else
		listBlock.style.display = "none";
}
</script>

TIP: trying googling the answer before posting, you'll find that more times than not someone else somewhere has had the same request and posted an answer online.
----
I have recently been semi-converted to ensuring all my code (well most of it) works in both javascript and non-javascript enabled browsers