javascript - mouseenter 和 leave 应用于两个 DOM 元素

Question

我有一个 DOM 元素，当它悬停时，应该为另一个 DOM 元素的不透明度（到 1）设置动画。由于事物的 z 顺序，我不能嵌套第二个元素，但我希望交互使得只要你在任何一个 DOM 元素上，它们应该保持可见，但是如果你滚掉任何一个元素，第二个元素应该将其不透明度设置为零。

有人知道怎么做吗？

Answer 1

使用 jQuery 你可以做类似的事情

  var show = false;
  $(element1).hover(function()
   {
      if(!show)
      {
        show = true;
        $(element2).fadeIn();
      }
   });
  $(element2).hover(function()
   {
     if(!show)
     {
       $(this).fadeIn();
       show = true;
     }
   };
  $(element1, element2).mouseleave(function(){$(element2).fadeOut();});

我使用 show 变量的原因是因为如果第二个元素已经显示，您不想淡化它。您可以通过用逗号分隔不同的选择器来将多个选择器组合在一个集合中。希望这对你有用。