<HTML>
<HEAD>
<TITLE>Expanding and collapsing menu system</TITLE>
<SCRIPT LANGUAGE = "JavaScript">

function controlExpand() {
 var sup = event.srcElement.id; // ID of super menu that was clicked 
    if (sup != '') {
    var sub = document.all[(sup + "Sub")] // ID plus "Sub"
        if (sub != null) { // if sub menu exists, toggle display
            if (sub.style.display == 'none') sub.style.display = '';
            else sub.style.display = 'none'; 
        }
    }
}

</SCRIPT>
</HEAD>
<BODY>

<DIV onClick = "controlExpand()">
    <!-- Game Super Menu -->
    <DIV ID = "game">Game</DIV>
    <!-- Game Sub Menu -->
    <DIV ID = "gameSub" STYLE = "display: none;">
        <!-- Start Super Menu -->
        <DIV ID = "start">Start</DIV>
        <!-- Start Sub Menu -->
        <DIV ID = "startSub" STYLE = "display: none;">Start Menu Contents</DIV>
        <!-- Rules Super Menu -->
        <DIV ID = "rules">Rules</DIV>
        <!-- Rules Sub Menu -->
        <DIV ID = "rulesSub" STYLE = "display: none;">Rules Menu Contents</DIV>
    </DIV> 
</DIV>


</BODY>
</HTML>