动画完成后回调函数

Question

here is my small problem:

I want to call to functions after animation completed. I can one with this example. But I need to call one more.

Sample code

$('.content').animate({
    left: '100'}, {
    duration: 500,
    complete: onComplete /* function is passed as a variable, not called directly , 
                             its doesn't work like : onComplete()*/
});

I have already tried following things and I don't get it. how to fix it.

try 1. complete:onComplete, secondonCompletefn
try 2. complete:onComplete, 
       complete:secondonCompletefn

Thank you.

Answer 1

$('.content').animate({
    left: '100'}, {
    duration: 500,
    complete: function(){
        onComplete();
        secondonCompletefn();
    }
});

Answer 2

You should be able to pass the callback as a third parameter(second is the duration) to the animate function, like:

$('.content').animate({
    left: '100'}
}, 500, function() {
 onComplete();
});

Answer 3

Try this

function foo(){
        onComplete();
        secondonCompletefn();
}
$('.content').animate({
    left: '100'}, {
    duration: 500                         
}).promise().done(foo);// this will animate and then call the function