jQuery闪烁mouseOver问题

Question

我有一张图片，上面显示了一个标题。标题浮动在图像上，并显示在底部。

我有一个jQuery事件，当你将鼠标悬停在图像上时，它会显示标题。如下所示：

function showCaption(id) {
var theID = "#caption_" + id;
$(theID).fadeIn('200');
}

当你推出的时候：

function hideCaption(id) {
var theID = "#caption_" + id;
$(theID).fadeOut('200');
}

但是，当您滚动标题时，它会认为您已从图像中滚出并淡出。有什么办法可以解决这个问题吗？

这里有一个链接：Example

谢谢，Coulton

Answer 1

我看了你的JS，但我找不到是什么触发了标题的显示-你应该将事件绑定到图像的父div，这样它就不会淡出。如果它当前只绑定到图像，那就是你的问题。附言:包含一个代码示例总是有帮助的。

Answer 2

Here is a fiddle，它展示了如何做到这一点的示例。当鼠标进入标题元素时，它只是在该元素上调用stop：

$("#caption").mouseover(function() { 
    $(this).stop(); 
});

stop函数取消在所选元素(在本例中为caption元素)上运行的所有动画。