2

I'm trying to fire up a function after the animation has finished but i can't make it work.

Here is my code:

var count = 3;
var timer = setInterval(function () {
    handleTimer(count);
}, 1000);

function endCountdown() {
    $('.begin-btn').html("GO!");
}

function handleTimer() {
    if (count === 0) {
        clearInterval(timer);
        endCountdown();
    } else {
        $('.begin-btn').html(count);
        count--;
    }
}


$('.begin-mrsuper').delay(500).animate({
    "left": "4px"
}, "slow").promise().done(function (handleTimer) {});

I tryed and:

    $('.begin-mrsuper').delay(500).animate({"left":"4px"}, "slow").promise().done(function(){ handleTimer(); });

But the 3,2,1, GO timer starts before the animation finishes, any ideas?

Speedwheelftw
  • 393
  • 6
  • 19

2 Answers2

1

Wrap the setInterval part into a function, or it will be executed once you called it.

var count = 3, timer = null;
var foo = function() {
    timer = setInterval(function () {
        handleTimer(count);
    }, 1000);
};

function endCountdown() {
    $('.begin-btn').html("GO!");
}

function handleTimer() {
    if (count === 0) {
        clearInterval(timer);
        endCountdown();
    } else {
        $('.begin-btn').html(count);
        count--;
    }
}


$('.begin-mrsuper').delay(500).animate({
    "left": "4px"
}, "slow").promise().done(foo);
xdazz
  • 158,678
  • 38
  • 247
  • 274
  • If I paste your code it doesn't work anymore, but I saw that I put .done(function (handleTimer) {}); instead of .done(handleTimer); and now it works, thanks. – Speedwheelftw Mar 21 '14 at 00:42
  • @xdazz Good post! @Marinescu Edward. Good tests! Similar case with respect to jquery's `.done()` `resolve` "order" http://stackoverflow.com/a/22496969/2801559 – guest271314 Mar 21 '14 at 04:00
1

Something like this might just work: 

$('.begin-mrsuper').delay(500).animate({
    "left": "4px"
}, "slow", function(){ handleTimer(); }).promise();
gkc
  • 449
  • 6
  • 18