jQuery - Chờ đợi cho fadeOut hoàn thành trước khi chạy fadeIn

Question

Tôi đã tự hỏi nếu có bất kỳ cách nào để chờ cho đến khi fadeOut được hoàn thành trước khi fadeIn bắt đầu, như khi tôi chạy đoạn mã sau, nó đặt một div dưới khác, sau đó khi nó phai mờ nó di chuyển lên ... trông hơi xấu xí.

Mã là như sau:

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

Answer 1

Chức năng fadeOut có một callback mà nó thực thi khi các hình ảnh động được thực hiện:

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

Answer 2

Một lựa chọn khác là sử dụng lời hứa mà sẽ chờ đợi cho tất cả các hình ảnh động cấp phát trên .sidebarform để hoàn tất trước tiên ngay cả khi chúng được bắt đầu từ nơi khác:

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