supersize
supersize

Reputation: 14773

pause executing function on purpose

I have a simple .click() function with some functions in it:

$mario.on('click', this, function() {

    var width_mario  = $window.width()/2;
    $contentw.animate({left: '100%', marginLeft: -width_mario, marginTop: 0}, 600);
    $fixed.css({'background-color': '#510000', 'left': '25%'});
    createMario();
    trigger(); // fire trigger not until createMario() is finished with animation
});

inside the function of createMario() are loads of jQuery .animate()ions. What I intend to do is, to fire trigger not until the animations of createMario()are finished. Something like the return function you can do if an animation is finished BUT inside the click function.

Thanks

edit: and not with setTimeout() because the animations have a random speed.

Upvotes: 0

Views: 63

Answers (3)

Solomon Closson
Solomon Closson

Reputation: 6217

You can also use element.promise.done(function() { trigger(); }); if you're animating 1 element in the createMario function, or you can attach it to the longest animated element also (the one that takes the longest to finish), and it will call the trigger() function after that element has finished animating.

Here's a jsFiddle I put together that exemplifies this: http://jsfiddle.net/WPHmY/2/

Upvotes: 1

frnhr
frnhr

Reputation: 12903

pass it as a callback, something like this:

function createMario(calback_fn) {
    ...
    animate({...}, {duration: 12345, complete: callback_fn});
    ...
}

Make sure you add it to the longest animate call. Note that may need to slightly change the animate syntax, see http://api.jquery.com/animate/ for different argument options).

Then do:

...
$fixed.css({'background-color': ... as before... });
createMario(trigger);

Upvotes: 1

T.J. Crowder
T.J. Crowder

Reputation: 1074008

You can't literally do that. What you need to do instead is pass a reference to the trigger function into createMario and have it call that function when the animations are finished. Assuming the animations are via jQuery, they have a callback they call when they're done.

Upvotes: 2

Related Questions