GlideMenus

Event Handlers

• Event Handlers

• Overview
• actuatorMouseover
• showMenu
• headerMouseover
• showSubMenu

Using showSubMenu and hideSubMenu

We can create a submenu for the "products" menu:

<div id="eqmasterFrame" class="menuFrame">

    <!-- menu -->
    <div id="eqmaster" class="menu">
    
     <!-- menu items (or other random html) -->
        <div><a href="#">Download Trial</a></div>
        <div><a href="#">Buy</a></div>
        <div><a href="#">Updates</a></div>
    
    </div>
</div>

Next, we add a call to showSubMenu and hideSubMenu in the desired "prodcuts" menu item, "EQ Master"

<!-- menu frame -->
<div id="productsFrame" class="menuFrame">

    <!-- menu -->
    <div id="products" class="menu">
    
     <!-- menu items (or other random html) -->
        <div><a href="#">Direct Vox</a></div>
        <div><a href="#">Mix Plus</a></div>
        <div><a href="#" 
            onmouseover='showSubMenu(event, "products", "eqmaster", "se", 0,0)'
            onmouseout='hideSubMenu("eqmaster")'
        >EQ Master   <span class="subMenuArr">></span></a></div>
    
    </div>
</div>

See how showSubMenu works

showSubMenu Example

---

Whew! That concludes the mini-chapter on Event Handlers. Use the Function Reference page for a quick reference.

Next, we'll look at how to modify the CSS