jquery - jQuery slideDown的div覆盖在图像slideUp立即

Question

我正在尝试在将鼠标悬停在图像上时滑入和滑出的图像上创建叠加层。与此问题相同的原因 - JQuery Text slideDown / slideUp Overlay on Image Keeps Bouncing？.

我已将我的代码放在 jsFiddle 中，因此可以访问 - http://jsfiddle.net/jamescallaghan/hg9r7/

任何帮助将非常感激。

Answer 1

I think the issue you were having was that the hover was based off the image element and not the .slide so when that text panel slid upwards it covered the image and when you moved the mouse it acted as a hover/unhover.

Please take a look at this, i just updated your code a bit. should work with multiple slides :) Hope this helps!

http://jsfiddle.net/NuWna/2/

All the best, Anthony

Answer 2

您可能应该对每个功能使用 mouseenter og mouseleave。

唯一的问题是，如果鼠标悬停在您向上滑动的新 div 上，它将向下滑动。所以你需要解决这个问题。

这是部分修复：

http://jsfiddle.net/hg9r7/3/

编辑：实际上这就是你的代码已经做的，所以没有真正的改进。您的代码的问题是您的鼠标光标有时会越过您正在拉起的框，这意味着您要离开 .slide img