jqueryを使用して一連のアニメーションを次々と実行する方法は？最初のアニメーションが完了した後

Question

これは、第2の画像をアニメーション化します：私は以下しようとした4枚の画像がある場合は

<script type="text/javascript"> 
     $(document).ready(function() { 

      $('#image1').show("slide", { direction: 'left' }, 1000, 
      function() { $('#image2').show("slide", { direction: 'left' }, 1000)}); 

    </script> 

- とだけ最初の2枚の画像をアニメーション化します。

<script type="text/javascript"> 
     $(document).ready(function() { 

      $('#image1').show("slide", { direction: 'left' }, 1000, 
      function() { $('#image2').show("slide", { direction: 'left' }, 1000)}, 
      function() { $('#image3').show("slide", { direction: 'left' }, 1000)}, 
      function() { $('#image4').show("slide", { direction: 'left' }, 1000)}); 

    </script> 

これで、すべての画像（4）を順番にアニメーション化する効果的な方法はありますか？

Answer 1

$('#image1').show("slide", { direction: 'left' }, 1000, function() { 
    $('#image2').show("slide", { direction: 'left' }, 1000, function() { 
     $('#image3').show("slide", { direction: 'left' }, 1000, function() { 
      $('#image4').show("slide", { direction: 'left' }, 1000); 
     }); 
    }); 
}); 

あなたも行うことができます：

slide(1); 
function slide(id){ 
    if(id<5){ 
     $('#image'+id).show("slide", { direction: 'left' }, 1000, function(){ slide(id+1)); 
    } 
} 

Answer 2

私は構文/書式設定はここから外れていると思います。二番目と三番目の行にはならないはずの閉じ括弧があります。

<script type="text/javascript"> 
     $(document).ready(function() { 

    $('#image1').show("slide", { direction: 'left' }, 1000, function() { 
     $('#image2').show("slide", { direction: 'left' }, 1000, function() { 
      $('#image3').show("slide", { direction: 'left' }, 1000, function() { 
       $('#image4').show("slide", { direction: 'left' }, 1000); 
      }); 
     }); 
    }); 
    }); 

</script>