CODEWITHSUNDEEP
javascriptjquery
RustBeard
RustBeard

Reputation: 79

Run function after animation is completed

I've tried give callback function (FUNCTIONX) in .animate(), but it fires immediately - and doesn't waiting for animation end. 

nav.click(function () {
    holder.stop(true, true);
    var target = $(this).attr('class');

    if (target === 'right') {
        var value = current.width();
        holder.animate({
            right: '+=' + value
        }, slideSpeed, FUNCTIONX());
        current = current.next();
    } else {
        var value = current.prev().width();
        holder.animate({
            right: '-=' + value
        }, slideSpeed, FUNCTIONX());
        current = current.prev();
    }
});

Also tried with .promise() (as below) with same effect. 

        var value = current.width();
        holder.animate({
            right: '+=' + value
        }, slideSpeed);
        current = current.next();
        nav.promise().done(function() {
          alert( 'dupa' );
        });

How run function after this animation is completed, after slide effect ends?

Upvotes: 0

Views: 317

Answers (1)

micah
micah

Reputation: 8096

FUNCTIONX is called immediately here. Try removing ().

From:

holder.animate({
  right: '+=' + value
}, slideSpeed, FUNCTIONX());

To:

holder.animate({
  right: '+=' + value
}, slideSpeed, FUNCTIONX);

Upvotes: 1

Related Questions