jquery - 试图将鼠标悬停在一个 div 上以激活另一个 div 的淡入淡出

Question

我试图让特定的 div 淡入 (left_panel_fade)，并在鼠标悬停在名为 left_panel 的 div 上时保持可见。

当我使用这段代码时，当我将鼠标悬停在 left_panel 上时没有任何反应:

      $("#left_panel").mouseover(function() {$("#left_panel_hover").fadeIn("slow");});
      $("#left_panel").mouseout(function() {$("#left_panel_hover").fadeOut("slow");});

这段代码对我有用，但不会褪色:

$("#left_panel").mouseover(function(){$("#left_panel_hover").css('visibility','visible'); });
$("#left_panel").mouseout(function() {$("#left_panel_hover").css('visibility','hidden'); });

为什么我的第一个代码不起作用？我是否正确使用了 fadeIn/fadeOut？ 我已经尝试将 mouseover 和 mouseout 更改为 mouseenter 和 mouseleave，但没有结果。

Answer 1

您最初需要使用 display: none 而不是 visibility: hidden 来隐藏 left_panel_hover。

注意 this fiddle工作正常，但是 this fiddle什么都不做——唯一的区别是 left_panel_hover 在 CSS 中的隐藏方式。