Jquery Stop Fadein / Fadeout

Your stop() is misplaced.

Try this:

$(".txtWrap").hover(  function () {    $(this).find('.txtBock').stop().fadeOut();    $(this).find('.txtDesc').fadeIn();  //  $('#timeTxt').fadeOut();  //  $('#timeTxtDesc').fadeIn();  },  function () {    $(this).find('.txtBock').fadeIn();    $(this).find('.txtDesc').stop().fadeOut();  })

EDIT:

This will animate the elements' opacity without hiding the element. If you want them hidden, use .hide() you'll need to add a callback to the animate function.

$(".txtWrap").hover(  function () {    $(this).find('.txtBock').stop().animate({opacity:0}, 500);    $(this).find('.txtDesc').animate({opacity:1}, 500);  //  $('#timeTxt').fadeOut();  //  $('#timeTxtDesc').fadeIn();  },  function () {    $(this).find('.txtBock').animate({opacity:1}, 500);    $(this).find('.txtDesc').stop().animate({opacity:0}, 500);  })

Thought I would post this because none of these answers worked for me.

*The true params tell stop to clear the queue and go to the end of the animation

$(".txtWrap").stop().hover(  function () {    $(this).find('.txtBock').stop(true, true).fadeOut();    $(this).find('.txtDesc').fadeIn();  },  function () {    $(this).find('.txtBock').fadeIn();    $(this).find('.txtDesc').stop(true, true).fadeOut();  })

Link: http://forum.jquery.com/topic/jquery-hover-events-cant-keep-up-with-fadein-and-fadeout-events-queue

In times like this I turn to Brian Cherne's genius .hoverIntent() plugin -- It's quite smooth...waits until the user has slowed down enough before executing. You can configure it to your needs.

Just include the plugin (it's short enough I'll sometimes place it directly into my script file) then add the word Intent:

$(".txtWrap").hoverIntent(  function () {    $(this).find('.txtBock').fadeOut();    $(this).find('.txtDesc').fadeIn();  },  function () {    $(this).find('.txtBock').fadeIn();    $(this).find('.txtDesc').fadeOut();  })