jquery - 鼠标悬停后一直淡入

Question

我试图淡入

在鼠标悬停和在鼠标移出时淡出：

  $("p.follow").mouseover(function(){
        $(this).fadeTo("slow", 1.00);
})
$("p.follow").mouseout(function(){
        $(this).fadeTo("fast", 0.50);
})

如果你去 ryancoughlin.com 并在右侧，如果你翻过它，你会明白我的意思，它几乎就像被卡住并不断淡入一样。

有任何想法吗？

Answer 1

试试这个：

$("p.follow").hover(function()
   {
      $(this).stop().fadeTo("slow", 1.00);
   },
   function()
   {
      $(this).stop().fadeTo("fast", 0.50);
   });

两个关键区别：我使用 jQueryhover事件来关联 mouseover 和 mouseout 事件处理程序，这样子元素不会导致混乱的行为，并且我使用该stop()函数来防止动画重叠和相互抵消。

Answer 2

可能值得看一下hoverintent插件，它基本上使用了一点 setTimeout，这样如果用户快速将鼠标移过元素，它就不会激活。自己编写代码很容易，但值得一看。

Answer 3

每次鼠标移到元素上时都会触发 mouseover 事件。由于效果是按顺序执行的，并且鼠标悬停非常频繁地触发，因此您会得到很多必须“缓慢”执行的效果。

您可能想要的是悬停事件，每个条目只执行一次。