JQuery - 在离开两个元素时隐藏元素

Question

下面的代码使＃testnav1元素在＃admin1上空盘旋时出现。

我希望能够隐藏＃testnav1当mouseleaves BOTH元素，而不仅仅是一个或另一个。基本上，当鼠标悬停在＃admin1元素的左侧时，它会使＃testnav1出现在下拉菜单中。

<script> 
    $(function() { 
     $("#admin1").hover(function() { 
      var x = $(this).offset(); 
      var leftAjust = x.left - $("#testnav1").css("width").replace(/[^-\d\.]/g, '') - 1; 
      $("#testnav1").css({"position": "absolute", "left": leftAjust, "top": x.top}).show();     
     }); 
    }); 
</script> 

Answer 1

试试这个，

$("#admin1").hover(function() { 
    var x = $(this).offset(); 
    var leftAjust = x.left - $("#testnav1").css("width").replace(/[^-\d\.]/g, '') - 1; 
    $("#testnav1").css({"position": "absolute", "left": leftAjust, "top": x.top}).show();     
},function(){ 
    $("#testnav1").hide();// hide the element on mouse leave 
}); 

更新

var flagAdmin=false;var flagTestNav=false; 
$("#testnav1").mouseleave(function(){ 
    flagTestNav=true; 
    hideTestNav(); 
}) 
$("#admin1").hover(function() { 
    flagAdmin=false;flagTestNav=false; 
    var x = $(this).offset(); 
    var leftAjust = x.left - $("#testnav1").css("width").replace(/[^-\d\.]/g, '') - 1; 
    $("#testnav1").css({"position": "absolute", "left": leftAjust, "top": x.top}).show();     
},function(){ 
    flagAdmin=true; 
    hideTestNav(); 
}); 
function hideTestNav(){ 
    if(flagAdmin==true && flagTestNav==true) 
    { 
     $("#testnav1").hide();// hides only if both admin and testnav mouse-leaves 
    } 
}