How to stop the animation loop

Question

In the code below, the div is animated back and forth. Then I want the animation to stop when it hangs. It works if I delete this line: "$ (". Block "). Animate ({left: '0px'}, 1, animate); but then the div just animates when I don't want this. So, how to save the function .stop (), but still make the animation loop in infinity?

$(function animate(){
$(".block").animate({left: '+=500px'}, 2000);
$(".block").animate({left: '0px'}, 1, animate);
});

$(".block").hover(function(){
$(".block").stop();
$(".block").animate({ width:"20%", height:"20%"}, 500 );
});

Answer 1

Update

Not sure, that:

$(".block").stop( true, true );

- this is what you are looking for.

The former trueclears the queue, and the latter trueproceeds to the end of the animation queue, effectively ending the animation.

$(".block").stop( true );

This will clear the queue, but will NOT skip it to the end.

Answer 2

, $( ". block" ). mouseleave() . , div. , mouseenter mouseleave. , div, , , , . , ... , .

, !