javascript - .hover 和 div 出现干扰

Question

我正在制作一个小书签，当用户点击它时，它会从用户所在的页面上传一张图片，到目前为止一切顺利，但我遇到了一个问题。

我想要的是，

1. 用户点击书签
2. 用户将鼠标悬停在页面上的图像上。
3. 悬停时出现一个 div
4. 单击 div 时，它会转到我的网站。

但是出现的 div 与 .hover 混淆，它来回断断续续。我猜这是因为从技术上讲，用户不再将鼠标悬停在图像上，而是悬停在我创建的 div 上。

这是一个例子。 http://jsfiddle.net/P4b8H/

我该如何解决这个问题？

Answer 1

这里的问题是当您创建 div 时，您总是离开图像，即悬停在外面。但是在悬停功能中你隐藏了 div，所以你有点陷入无限循环。

要解决这个问题，请考虑将鼠标悬停在图像上，将鼠标悬停在div 上。

$("img").mouseover(function(){});

$('#WRAPPER').mouseleave(function() {});

我修改了你的 fiddle 。 http://jsfiddle.net/P4b8H/5/