在链接悬停显示div上，该字符显示在该div和链接的悬停上

Question

i have link and on link hover display div when leave cursor form div and link hide div using jQuery. i have code for display it, how can i hide it while i leave cursor from these link and div.this is my html code.

 <a href="javascript:void(0);" id="show_div">2 items</a>
 <div id="dropcart">contents</div>

<script type="text/javascript">
$(document).ready(function(){
 $("#show_div").hover(function(){
       $("#dropcart").fadeIn();
    });                 
});

Answer 1

$("#show_div").hover(function(){
     $("#dropcart").fadeIn();
});

$("#dropcart").mouseleave(function(){
    if($("#show_div").is(':hover') === false)
    $("#dropcart").fadeOut("fast"); 
});

demo

Answer 2

EDIT: (For the downvoters and OP)

I misunderstood the question. My suggestion, then, would be to use timeouts.

.hover(function(){ clearTimeout(window["timeoutVar"]); $("#dropcart").fadeIn(); },function(){window["timeoutVar"]=setTimeout(function(){ $("#dropcart").fadeout(); },50);});

Then apply that .hover to the div, also. That way, the div will fade out after a 50-millisecond delay IF the user does not hover over it, which will cancel the timeout (and prevent the fadeout).