title: Delaying a drop down menu from hiding
body: <p>Thanks to you guys, my menu is now usable because the submenu displays long enough for the user to get their mouse to the links.  Unfortunately, it's not exactly right. The submenu closes even when the users mouse is over it.  I have added the HTML code below along with the revised js file code.  I'm thinking the problem is in the $('.myMenu > li').bind('mouseout', closeSubMenu); line.  Perhaps an alternative would be to have a timeout delay AFTER the openSubMenu function is called to at least give users 8 seconds or so before the submenu hides.  This would be an acceptable solution to me.</p>
  
  <pre><code>&lt;!-- HTML menu code below --&gt;
  &lt;ul class="myMenu"&gt;
  &lt;li class="menuHeader"&gt;&lt;a href="#"&gt;Employees &lt;img src="images/arrowdown.gif" alt="Employee Links" width="11" height="8" border="0"/&gt;&lt;/a&gt;
  &lt;ul class="subMenu"&gt;
          &lt;li&gt;&lt;a href="#"&gt;Link1&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Link2&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Link3&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="#"&gt;Link4&lt;/a&gt;&lt;/li&gt;     
      &lt;/ul&gt;&lt;/li&gt;
  &lt;/ul&gt;       
  
  &lt;!-- js file code below --&gt;
  $(document).ready(function() {
      $('.myMenu &gt; li').bind('mouseover', openSubMenu);
      $('.myMenu &gt; li').bind('mouseout', closeSubMenu);
  
      function openSubMenu() {
          $(this).find('ul').css('visibility', 'visible');    
      };
  
      function closeSubMenu() {
          var ul = $(this).find('ul');
          setTimeout(function(){
          ul.css('visibility', 'hidden');}, 10000);
  
      };
  
  });
  </code></pre>