Javascript 将项目悬停一秒钟后设置图像动画

经过一些努力，我问你，如果你知道我的错误在哪里

这是我到目前为止的代码：

$(".menu a").hover( function () {
  $(this).data('timeout', setTimeout( function () {
        $(this).hover(function() {
            $(this).next("em").animate({opacity: "show", top: "-65"}, "slow");  
        }, function() {
            $(this).next("em").animate({opacity: "hide", top: "-75"}, "fast");
        });
  }, 1000));
}, function () {

  clearTimeout($(this).data('timeout'));

});

我很乐意得到一些帮助

---

我试过了，但没用。再多了解一点，也许会让事情变得更清楚。我以前有过这样的功能：

$(".menu a").hover(function() {
$(this).next("em").animate({opacity: "show", top: "-65"}, "slow");  
}, function() {
    $(this).next("em").animate({opacity: "hide", top: "-75"}, "fast");
});

它起到了作用，但会立即被观察到。因此，我发现这是为了设置一个计时器，在本例中仅在一秒钟后显示弹出窗口：

$("#hello").hover( function () {
  $(this).data('timeout', setTimeout( function () {
    alert('You have been hovering this element for 1000ms');
  }, 1000));
}, function () {
  clearTimeout($(this).data('timeout'));
});

---

这两个函数都是自己工作的，但是如果我把它们放在一起，它在

setTimeout

回调中什么也不做，

这个

并不指向悬停的元素

要解决这个问题，您需要在事件处理程序中创建一个单独的变量，如下所示：（双关语）

---

您不需要在内部的

hover

处理程序中使用

me

，但也可以使用。

在

setTimeout

回调中，

此

不引用悬停元素

要解决这个问题，您需要在事件处理程序中创建一个单独的变量，如下所示：（双关语）

---

您不需要在内部的

悬停

处理程序中使用

me

，但也可以使用。

有一个很好的插件可以做到这一点：。将.hover替换为.hoverIntent，您就不必手动设置和清除超时。

有一个很好的插件可以做到这一点：。将.hover替换为.hoverIntent，您就不必手动设置和清除超时。

为什么要添加第二个悬停处理程序？你到底想做什么？为什么要添加第二个悬停处理程序？你到底想干什么？

$(".menu a").hover( function () {
    var me = $(this);

    me.data('timeout', setTimeout( function () {
        me.hover(function() {
            me.next("em").animate({opacity: "show", top: "-65"}, "slow");  
        }, function() {
            me.next("em").animate({opacity: "hide", top: "-75"}, "fast");
        });
  }, 1000));
}, function () {    
    clearTimeout($(this).data('timeout'));
});