jQuery - call function onmouseout but only if the cursor wasn't moved to a certain area
<p>I have this link:</p>

<pre><code>&lt;a class='itemshow'&gt;Show Details&lt;/a&gt;
</code></pre>

<p>When this link is hovered over, a div opens up below it with some content. That works fine. Now, I need a .mouseout() event which closes the div that was opened (div's id is gen_details) but ONLY if the cursor wasn't moved down to the div itself.</p>

<p>I have written a function which closes the div (see below, slideToggle does it), I just need a modification - a condition that checks whether the cursor is within the div's boundaries, and only executes the code if it's not.</p>

<pre><code>    $('a.itemshow').mouseleave(function()
        { 
//if(condition here to check if cursor is out of the div's boundaries){
        if($('#gen_details').hasClass("open")){
            $('#gen_details').slideToggle(300);
            $('#gen_details').removeClass("open");
                return false;
            }
//}
        });
</code></pre>

<p>Shouldn't be too complex but I can't figure out how to do it without any complicated hacks.</p>
