Javascript 鼠标器&x2B；鼠标悬停在两个不同的div上

嗨，我有这段代码来处理mouseenter，然后在2个叠加的div上离开

当用户鼠标进入主div时，子div会显示，如果用户进入子div，子div必须保留，但是如果用户离开主div并且不在子div，子div必须隐藏，请尝试使用我的JSFIDLE

但是我的代码中没有运行计时器

  $(".bulleHome").each(function () {
      var subDiv = $(this).find(".mupHome");
      $(this).mouseenter(function () {
          $(this).find(".mupHome").css("visibility", "visible");
          $(this).find(".mupHome").animate({
              marginTop: '-23px'
          });
      });
      $(this, subDiv).mouseleave(function () {
        // this is not run
          timer = setTimeout(function () {
              $(this).find(".mupHome").css("visibility", "hidden");
              $(this).find(".mupHome").animate({
                  marginTop: '+23px'
              })
          }, 50);
      });
      $(this, subDiv).mouseenter(function () {
          clearTimeout(timer);
      });
  });

以及html：

<div class="bulleHome ombreV">
    <a href="http://preprod.mupiz.com/georges-barret" style="font-size:0.7em;text-decoration:none;" pid="13200">
        <img src="http://www.mupiz.com/images/img-membres/images_4958C.jpg" alt="Georges profil" height="100px"><br>
    </a>
    <div class="mupHome" style="visibility: visible; margin-top: -23px;">
        <img src="http://www.mupiz.com/images/mupitR.png" alt="Mup It!" id="bouton-ajout-ami13200" onclick="alert('ok')" style="cursor: pointer;"><span class="tMupHome">Mup it!</span>

    </div>
</div>

有什么想法吗

Js小提琴：

---

谢谢

我猜您希望div向后移动，并在鼠标离开sub div时消失。如果是这种情况，这应该可以正常工作。如果不是，我们肯定需要一些澄清。您正在更改动画之前的可见性，因此动画将不可见。小提琴上也少了几句名言

    $(".bulleHome").each(function () {
  var subDiv = $(this).find(".mupHome");
  $(this).mouseenter(function () {
      $(this).find(".mupHome").css("visibility", "visible");
      $(this).find(".mupHome").animate({
          marginTop: '-23px'
      });
  });
});
// Added Code 
$('div.mupHome').on({
mouseleave: function() {
$(this).animate({marginTop: '+0px'}, 1000, function(){$(this).css('visibility', 'hidden');});}
});

另外，在mupHome div中，样式没有正确关闭，不确定在实际代码中这是否正确

<div class="mupHome" style="visibility: visible;>

---

我建议您创建一个var X并将其设置为false。然后，如果鼠标移动到细分曲面上，则将其设置为true：

$(".mupHome").mouseenter(function () {
      ondiv = true;
  });

在此之后，您只需在离开第一个div时验证var X是否设置为true，如果是，则不执行任何操作。如果仍设置为false，则隐藏子曲面：

$(this, subDiv).mouseleave(function () {
      if(ondiv === false)
      {
          $(".mupHome").animate({
              marginTop: '23px'
          },function() {
              $(".mupHome").css("visibility", "hidden");
          });

      }
});

以下是说明。
当您发布类似于此的Javascript时，请显示相关的HTML。我们怎么知道你的HTML标记与脚本不一致？是的，对于这种代码，我想在这个问题上帮助你的真正因素是看到HTML。在你的问题中加入一些行和。当离开两个div中的一个，而不悬停另一个时，你想执行一些东西，是吗？你能给我们看一些html吗？我添加了JSFIDLE和html，谢谢。。。你可以澄清一下它是如何工作的吗？这不起作用动画不要回到“基本位置”可见性：隐藏等。。如果用户只是进入.bulleHome，而不仅仅是进入.bulleHome，这将不起作用。你是什么意思？如果用户只是进入.bulleHome，而不仅仅是进入.bulleHome，你能说得更具体些吗？不完全是我想要1）当鼠标离开子分区时，分区移回原位并消失。2）当鼠标进入时，分区也移回原位。bulleHome但不是。将marginTop:muphomechaning设置为0px将使分区回到原来的位置。在这种情况下，至少当子div叠加在父div上时，鼠标不能离开子div而不离开父div。我将稍微清理一下此代码以删除不必要的函数
$(".mupHome").mouseenter(function () {
      ondiv = true;
  });

$(this, subDiv).mouseleave(function () {
      if(ondiv === false)
      {
          $(".mupHome").animate({
              marginTop: '23px'
          },function() {
              $(".mupHome").css("visibility", "hidden");
          });

      }
});