JQuery - 留下两个元素时隐藏元素

Question

下面的代码使#testnav1 元素在悬停在#admin1 上时出现。

我希望能够在鼠标离开两个元素时隐藏#testnav1，而不仅仅是一个或另一个。基本上，它是下拉菜单的一部分，它使#testnav1 在悬停时显示在#admin1 元素的左侧。

<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
    }
}