Home > Software design >  How do I slideUp with animate as a function so that code waits until both events are done
How do I slideUp with animate as a function so that code waits until both events are done

Time:04-18

I understand that in order for an even to happen 'after' a slideUp the following callback code can be used:

$('#something').slideUp('fast', function() {
   ... stuff to do after the slide is complete...
});

I want to achieve a slideUp with an animation to perform in the same way.

$('#something').slideUp().animate({opacity: 0,duration: 'fast'});

How do I transpose this code into a function that waits until both the slideup and the animation are complete before performing further code?

CodePudding user response:

Something like this??

function animateAndExecute(functionToExecute) {
    $('#something').slideUp().animate({opacity: 0,duration: 'fast'});
    setTimeout(functionToExecute, 400) // Time taken to slide up. Use 600 if u use `slow` for animation duration.
}

and use it like

animateAndExecute(function() {
    // Code to execute after sliding and animating
})
  • Related