jquery - Jquery 悬停时淡入和淡出图像

Question

我正在使用一个非常基本的 jquery 脚本来在悬停时显示图像(如下所示):

HTML:

<li>
    <div class="block">
      <div class="drag"></div> (display:none in css)
    </div>
</li>

<li>
    <div class="block">
      <div class="drag"></div>
    </div>
</li>

...更多具有相同格式的列表项。Jquery 是:

$(".block").hover(function(){
      $(this).find(".drag").stop().fadeIn(250);                
  }, function(){
      $(this).find(".drag").stop().fadeOut(250);
});

虽然这有效，但效果不是很好。随机地，一些 .block div 不显示图像，有些则不会完全淡入。这种情况是随机发生的……尽管整体效果有效。关于为什么会发生这种情况的任何想法，或者编写此脚本的更好方法？

Answer 1

您可以引用本教程来了解如何以不同的方式使用 stop... use of stop()

最适合您情况的方法是...

$(".block").hover(function(){
  $(this).find(".drag").stop(true,true).fadeIn(250);                
}, function(){
  $(this).find(".drag").stop(true,true).fadeOut(250);
});