Hi,

I want to create a simple menu of items.  Suppose I have three main menu
items:

    Menu1
    Menu2
    Menu3

When a user clicks on Menu1, I want it to expand to reveal sub menu items.
When a user clicks on Menu1 once again, I want it to retract and hide its
sub menu items.

    Menu1
       SubMenu1
       SubMenu2
    Menu2
    Menu3

Like wise behavior for Menu2 and Menu3.

How do I do it?

Thanks.

http://www.google.com/search?q=dhtml+expand+menu

There are probably hundreds of examples of dhtml expandable menus out there...

--
Michael Harris
Microsoft.MVP.Scripting
Seattle WA US
--

to make "collapsible menus" use the display property of a div ...
<script>
function toggleChildren(el)
{
 var ChildDocumentAllIndex = el.sourceIndex + 1;
 var ChildMenuEl = document.all[ChildDocumentAllIndex];
 if(ChildMenuEl.style.display == "inline")
  ChildMenuEl.style.display = "none";
 else
  ChildMenuEl.style.display = "inline";
</script>
<h1 onclick="toggleChildren(this)">menu1</h1>
<div style="display: none;">
  subitem 1, 1<br>
  subitem 1, 2
</div>
<h1 onclick="toggleChildren(this)">menu2</h1>
<div style="display: none;">
  subitem 2, 1<br>
  subitem 2, 2
</div>
<h1 onclick="toggleChildren(this)">menu3</h1>
<div style="display: none;">
  subitem 3, 1<br>
  subitem 3, 2
</div>

this is ie4+ specific code not ns supported because of document.all
notice how we change the display property of the style object from none to
inline

etan