Object Oriented Drop Down Menu - tumbleweed
<p>Is there a way to shape my Javascript Menu Methods into the module pattern?  More generally, what is the best practice way to combine/shape these methods?</p>

<p>Is it already in "best form"?</p>

<p><strong>Calling HTML</strong></p>

<pre><code>&lt;a href="#" onmouseover="menu.top_mouse_over('m1')" onmouseout="menu.mouse_out()"&gt;Account&lt;/a&gt;
&lt;div id="m1" onmouseover="menu.bottom_mouse_over()" onmouseout="menu.mouse_out()"&gt;
&lt;form name="f2" method="post"&gt;
    &lt;a id="signout_button" href="javascript:void(0)"&gt;Logout&lt;/a&gt;
&lt;/form&gt;
</code></pre>

<p><strong>Javascript</strong></p>

<pre><code>var menu = {   

    menu_timer:0,
    menu_element:0,

    /* called when mousing over the top menu item */
    top_mouse_over: function (id) 
    {
        menu.bottom_mouse_over();
        menu.menu_element=document.getElementById(id);
        menu.menu_element.style.visibility='visible';
    },

    /* hide the menu when the timer runs out */
    hide_menu: function()
    {
        if(menu.menu_element)menu.menu_element.style.visibility='hidden';
    },

    /* keeps the menu open by clearing the timer when mousing over the menu items */
    bottom_mouse_over: function() 
    {
        if(menu.menu_timer)
        {
            window.clearTimeout(menu.menu_timer);
        }
    },

        /* set the timer to hide the menu, required by clearTimeout */
        mouse_out: function() 
        {
            menu.menu_timer=window.setTimeout(menu.hide_menu, 1000);
        }
}; 
</code></pre>
