javascript - 随机应用于元素的 jQuery 动画函数

Question

我有一个函数可以使用 jQuery UI 缓动使我的页面上的 6 个元素下降和反弹。

function drop_points(){
        $('.pointer').animate({
            top : '+=400'   
        }, 700, 'easeOutBounce');
    };

此刻，每个元素同时掉落，有没有办法应用这个函数让它们随机地一个接一个地掉落？

每个指针的标记都是这样......

<a href="#" class="pointer c1"></a>
<a href="#" class="pointer c2"></a>
<a href="#" class="pointer c3"></a>
etc...

我知道我可以使用回调并单独定位它们，只是这看起来很臃肿，我只是好奇是否有更好的选择。

谢谢

Answer 1

第一部分是将函数 shuffle 添加到 javascript Array 对象

Array.prototype.shuffle = function() {
  var i = this.length, j, temp;
  if ( i == 0 ) return this;
  while ( --i ) {
     j = Math.floor( Math.random() * ( i + 1 ) );
     temp = this[i];
     this[i] = this[j];
     this[j] = temp;
  }
  return this;
}

然后

var array = [1,2,3,4,5,6].shuffle();
var counter = 0

function drop_points(){
  $('.c'+array[counter]).animate({top :'+=400'}, 700, 'easeOutBounce',function(){
    counter++;
    if(counter<array.length-1)drop_points();
  });
}