Solution 1: cancel the previous animation:
$(function () {
$('.one').hover(function () {
$('.show').stop().fadeTo(600, 0);
},
function () {
$('.show').stop().fadeTo(600, 1);
});
});
Demo
Solution 2: stop event when the animation is not done yet (as you wanted, but this might not work properly because of the hover
function)
$(function () {
$('.one').hover(function () {
if (!$('.show').is(':animated')) {
$('.show').fadeTo(600, 0);
}
},
function () {
if (!$('.show').is(':animated')) {
$('.show').fadeTo(600, 1);
}
});
});