[jQuery] 要素を順番に上から落ちてくるように表示していく方法

特定の要素を上から順々に表示していきます。

#サンプルとコード

$(function(){
  var $target = $(".popingSample");

  $target.css({
      opacity: 0,
      marginTop: '-50px'
  });

  setTimeout(function(){
      $target.each(function (i) {
          $(this).delay(i*400).animate({ 
              opacity: 1,
              marginTop: 0
          }, 800, 'easeInOutBack');
      });
  }, 200);
});

#簡単な説明

.css()opacitymargin-topを見えないように変更します。これはjQueryを使わずにcssで設定してもいいのですが、何らかの原因でjQueryが実行できなかった場合にcssで設定したその非表示設定によりが表示されなくなる恐れがあるのでjQuery側で設定した方が無難かもしれません。
margin-topがネガティブから0に戻すことで、上から下に降りてくるような動きになります。

setTimeoutで200ミリ秒後に要素を表示する処理を実行します。これは任意の数値で結構です。時間差が必要ない場合はsetTimeoutを外してください。

次に$targetをループを使って順々に表示させていきます。最初にcss()で設定したプロパティをanimate()で戻します。delay(i*200)を使うことでループごとに200ミリ秒ごと処理がずれて順々に表示されるような動きになります。(iはインクリメントしていきます)
easingはお好みで。