jQuery - Esperando que el fadeOut se complete antes de ejecutar fadeIn

Question

Me preguntaba si hay alguna manera de esperar hasta que fadeOut se complete antes de que comience el fadeIn, ya que cuando ejecuto el siguiente código, coloca un div debajo del otro, luego cuando se desvaneció se mueve hacia arriba ... se ve un poco feo.

Código es el siguiente:

$('.sidebarform').fadeOut('slow'); 
$('.sidebarsuccess').fadeIn('slow'); 

Answer 1

La función fadeOut tiene una devolución de llamada que se ejecuta cuando se realiza la animación:

$('.sidebarform').fadeOut('slow', function() { 
    $('.sidebarsuccess').fadeIn('slow'); 
}); 

Answer 2

Otra opción es usar promesa que esperar a que todas las animaciones pendientes en .sidebarform para completar primero incluso si se iniciaron en otro lugar:

$('.sidebarform').fadeOut('slow').promise().done(function() { 
    $('.sidebarsuccess').fadeIn('slow'); 
});