…nside of

another animation's callback, then that element's state becomes inconsisten. Any animations later applied to that element may not run.
Here is a sample of code that will demonstrate the issue:
$(document.body).html("<div id='content'></div>");
var $el = $("#content");
$el.css({height:'100px', width:'100px', 'background-color':'red', margin: '250px'});

$el.animate({height: "+=100"}, 1000, function(){
    $el.stop();

    //this animation is dropped
    $el.animate({width: "+=100"}, 1000, function(){
        console.log("will not run");

    }).animate({"margin-left": "+=100"}, 1000, function(){
        console.log("this wont run either, until the element's state is fixed");

    });

}).animate({height: "-=100"}); //this animation will be stopped

setTimeout(function(){
    //when this runs the element's state will be corrected
    //and the dead animations will resume
    $el.stop();
}, 5000);