jQuery将鼠标悬停在图像的一部分上

Question

我有一个图像和一个与图像重叠的跨度。当我将鼠标悬停在图像上时，会弹出一个范围，然后在鼠标移开时它会向下撤退。
这是一个简化的演示：http://jsfiddle.net/cCYHp/
问题： 我希望仅当SPAN区域被覆盖时才会弹出跨度，而不是图像。我试图做.hide()效果，但它不起作用（它在演示中被注释掉）。我认为这是因为一旦隐藏了跨度，它就不能再被淹没了。实现这种效果的正确方法是什么？

Answer 1

一种可能的解决方案：您的切换范围将其放入另一个透明且尺寸为图像大小的跨度中并将事件附加到其上。

另一个：将悬停绑定留给图像，但检查鼠标是否位于图像的下半部分。

我会推荐第一个。