Clever Geek Handbook

How do I do something after an event in jQuery?

I want to play the animation when another animation is done.

I used this code:

$("#test_01").stop().animate({height: '500'}, 2500).promise($("#test_02").fadeIn(2500));

This animates two at the same time - that's not what I want. I need $("#test_01")

to work first, and then I need to execute $("#test_02")

.

How can i do this?

+3


source to share


2 answers


Try done

with code:

$("#test_01").stop().animate(
    {height: '500'},
    2500
).promise().done(
    function(){
        $("#test_02").fadeIn(2500)
    }
);


The function callback done

will run after all the code from the animation has finished.

+4


source


Just use the full animate () callback

$("#test_01").stop().animate({
    height: '500'
}, 2500, function () {
    $("#test_02").fadeIn(2500)
});


If you are looking for a promise-based solution, you need to get the promise object and then add a completed callback to the promise where you will perform the pending operation.

+2


source






More articles:


All Articles