javascript - オブジェクト/画像をロードするAJAX - jQueryアニメーションが途切れる

Question

ホームページをロードしたときにいくつかのアニメーションが表示される Web サイトを構築しています (たとえば、メインのロゴといくつかのメニューが画面の端からスライドします)。同時に、バックグラウンドで AJAX を使用して、後で表示される可能性のある画像の読み込みを開始しています。これに関する問題は、画像がロードされているときにアニメーションが途切れ途切れになることです。これを止める方法はありますか？または、AJAX 関数の優先度を下げて、アニメーションの実行中に何もしようとしないようにすることはできますか?

これらの画像をロードするために使用している現在のスクリプトは次のとおりです。

$('.lightbox-container.first').load('/images/first_set/', function(){
    $('.lightbox-container.second').load('/images/second_set/', function(){
        $('.lightbox-container.third').load('/images/third_set/', function(){
            $('.lightbox-container.fourth').load('/images/fourth_set/', function(){
                $('.lightbox-container.fifth').load('/images/fifth_set/', function(){
                    $('.lightbox-container.sixth').load('/images/sixth_set/');
                });
            });
        });
    });
});

私のアニメーション関数はすべて次のようになります。

$('.third-section').animate({ 'opacity': '1', 'height': '200px', 'padding-top': '20px', }, 500);