如何在相对div的布局上jquery动画垂直fly-in

Question

我有一个我正在建造的画廊，我不能让相对的div垂直飞行， See jsfiddle.我也想在代码中添加缓动，但标准方法不起作用，似乎停止计数+ = interval;从跑步？

我正试图让它飞入like this.

 /*Fly in*/
  $(document).ready(function () {
      var count = 400;
      var interval = 40
      $(".gallery").each(function () {
          $(this).delay(count).animate({
              marginLeft: 0,
          }, 500);
          count += interval;
      });
  });
  /*Fly in End*/

Answer 1

我已经使用边距重做它来为它设置动画并使用css3添加缓动，因为它更平滑。
JS Fiddle Demo

    /*Fly in*/
  $(document).ready(function () {
       var count = 400;
    var interval = 30
    $(".gallery").each(function () {
        $(this).delay(count).animate({
marginTop:0,
}, 500 );
        count += interval;
      });
  });
  /*Fly in End*/

CSS

.gallery {
    width: 300px;
    height: 169px;
    margin-top: 800px;
    overflow: hidden;
    position: relative;
    float: right;
    -webkit-transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1) 0s;
    -moz-transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1) 0s;
    -o-transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1) 0s;
    transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1) 0s;
}