JQueryフェードイン関数が呼び出されていないようです

Question

以下に投稿されたJqueryで書いている関数について質問があります。最初の関数は正常に動作します。ページがロードされると、Jqueryはsidenav divフェードアウトを数秒で行い、noneを表示します。右のdivは左にスライドします。背景を赤に変えることはちょっとしたテストですが、すべてが完璧に動作します。

2番目の機能は、クリック可能なイベントです...スライディングdivを元の位置に戻すことになっています。それは何か。しかし、その後、それは退屈になっているはずですが、OnpageLoadを退廃させたdivです。この部分は機能しません。 divは隠れたままです。誰もこれで私を助けることができますか？他のdivが元の場所に戻った後、＃sidenav-cont divを表示するだけで後で元に戻す必要があります。

$(document).ready(function() { 
    $("#sidenav-cont").delay(2000).fadeToggle(3000).queue(function() { 
    $(".colleft").show("slow").delay(100).animate({right:'+=350'},2000).queue(function() { 
     $(this).css('background-color','red').stop(true, true); 
    }); 
    }); 
}); 


$(document).ready(function() { 
    $("a.open").click(function() { 
    $(".colleft").show("slow").animate({left:'+=350'},2000).queue(function() { 
     $("#sidenav-cont").fadeToggle(3000); 
    }); 
    }); 
}); 

Answer 1

あなたのコールバックが返す前dequeue()かqueue()によって、引数として与えられnext機能を呼び出すことはありません。失敗するとキューを効果的にロックし、コードの2番目の部分のコールバックが呼び出されない理由を説明します。

試してみてください。

$(document).ready(function() { 
    $("#sidenav-cont").delay(2000).fadeToggle(3000) 
         .queue(function(next) { 
     $(".colleft").show("slow").delay(100).animate({right:'+=350'},2000) 
        .queue(function(next) { 
      $(this).css('background-color','red').stop(true, true); 
      next(); 
     }); 
     next(); 
    }); 
}); 

$(document).ready(function() { 
    $("a.open").click(function() { 
     $(".colleft").show("slow").animate({left:'+=350'},2000) 
        .queue(function(next) { 
      $("#sidenav-cont").fadeToggle(3000); 
      next(); 
     }); 
    }); 
});