Question

I am using a very basic jquery script to show an image on hover (as shown below):

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>

….many more list items with same format.
The Jquery Is:

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

Although this works, it is not working VERY well. Randomly, some .block divs don’t show the image, and some don’t fade it in completely. This happens randomly….although the overall effect works. Any ideas on why this is happening, or a better way to write this script?

Answer 1

try using stop(true,true)
hope that helps