title: Jquery dropdown disappears on hover
body: <p>I set up a typical navbar, and when you hover over one element ("Our Teams") a dropdown appears (using the jquery below):</p>
  
  <pre><code>$("li#menu-item-20").hover(function(){
              $("#dropdown").stop().fadeIn(500);
          }, function(){
              $("#dropdown").stop().fadeOut(500);
          });
  </code></pre>
  
  <p>When you then hover over the dropdown (<code>#dropdown</code>) the dropdown fades back out (because I hovered off the menu item) I need the jquery to work so it will allow for hovering over the dropdown, and will fade out after you hover off the dropdown AND the nav menu.</p>
  
  <p>Any ideas? You can see a working example at <a href="http://pixelcakecreative.com/cimlife/" rel="nofollow">http://pixelcakecreative.com/cimlife/</a></p>