How to set up a "settimeout" properly for a jQuery function?
<p>I hope I can get some help. I'm new to Jquery and JavaScript and I got stuck with a "setTimeout" function.
I'm working on my navigation bar and basically I need a div(sub menu) to fade in when "click" on an anchor tag, fade it out if you move the mouse to a different navigation link and hide it all together if the mouse leaves it: like so:</p>

<ol>
<li><p>show on click but hide it after a couple of seconds</p></li>
<li><p>hide if after the mouse leaves the div.</p></li>
</ol>

<p>This is what I've got so far:</p>

<pre><code>$("a").click(function() {
    $("#sub_nav").fadeIn(400);
});

$("#sub_nav").mouseleave(function() {
    $(this).fadeOut(0);
});

$("#sub_nav").mouseenter(function() {
    if(this) {
        $(this).show(0);
    } else {
        setTimeout(function() {
            $(this).fadeOut(0);
        }, 2000);
    };
});
</code></pre>

<p>It works as expected except for the <code>setTimeout</code>.</p>

<p>Appreciate all the help I can get.</p>
