title: Javascript - Delay animate upon mouseleave
body: <p>I'm using a simply Javascript that makes a menu slide out upon mouseenter then slide in upon mouseleave. However, when the mouseleaves the area, I would like the menu to remain in place for a few seconds and then slide in.</p>
  
  <p>This is the code im using.</p>
  
  <pre><code>$('#nav').mouseleave(function()
      {
              $("#nav").animate({"left": "0"}, "1000");
              $("#nav li a").css({ opacity: 0.7 });
              $("#nav li.current a").css({ opacity: 1 });
  });
  </code></pre>
  
  <p>I've search stack overflow and google, but haven't been able to get any of the solutions to work. I'm only new to JS</p>
  
  <p>Any ideas?</p>