Expand /Collapse Menu -on page load I need the menu collapsed....

[Eskarina]

Hi,

could someone help me figureout how to have my menu in the collapsed state when the page loads please ?

here is the javascript ...

function toggleList(id){
if(document.getElementById){
var element = document.getElementById(id);
if(element){
element.style.display =(element.style.display == 'none')?'':'none';
}}}

------------------------
applied to ul div...

<h2>Expand -Collapse</h2> <a href="javascript:toggleList('idname')">[+/-]</a></strong>
<ul id="idname" style="display:block">
<li><a href="#html" target="_self">Number One</a></li>
<li><a href="amana.html" target="_self">Number 2</a></li>
<li><a href="baumatic.html" target="_self">Number 3</a></li></ul>



Which I found from here (http://lists.evolt.org/archive/Week-of-Mon-20030811/146500.html) It's just what I was looking for except that I'd really like it to be in a collapsed state as default.

Thanks in advance for any help I may get :)

[giraph]

change

<h2>Expand -Collapse</h2> <a href="javascript:toggleList('idname')">[+/-]</a></strong>
<ul id="idname" style="display:block">
<li><a href="#html" target="_self">Number One</a></li>
<li><a href="amana.html" target="_self">Number 2</a></li>
<li><a href="baumatic.html" target="_self">Number 3</a></li></ul>


to


<h2>Expand -Collapse</h2> <a href="javascript:toggleList('idname')">[+/-]</a></strong>
<ul id="idname" style="display:none;">
<li><a href="#html" target="_self">Number One</a></li>
<li><a href="amana.html" target="_self">Number 2</a></li>
<li><a href="baumatic.html" target="_self">Number 3</a></li></ul>

[Eskarina]

Thanks giraph :) that's great.

I did mess about with those values but was stabbing in the dark as I don't even know the right terms to use.

Thanks again ;)

[morgue]

Hey, how would you make it start "collapsed"? :confused:

[morgue]

Got it...
didn't notice the style="display:none;">