Jquery:尝试按特定顺序淡化网格的方块

Question

提前感谢您对此问题的任何帮助.

问题:

使用Jquery我想在这些方块上创建一个wave(下图).

所以正方形会按此顺序.fadein.

0(左上角第一个方块)

1,8(然后第二个方行1和第一个方行2同时)

2,9,16(依此类推)

3,10,17,24(等等)

4,11,18,25,32(等等)

我知道我可以手动延迟每个方格和时间fadein但我正在寻找一种更有活力的方式来实现这种效果.

如果我能指出正确的方向,我会很高兴的.

Answer 1

干得好.使用系数和jquery delay函数进行简单的数学计算:

$('.container div').fadeTo(0,0).each(function(index) {
    var dif = index % 8;
    var lambda = parseInt(index / 8);
    $(this).text(index);
    $(this).delay(40 * (dif + lambda)).css('visibility','visible').fadeTo(80,1)
});

代码:http://jsfiddle.net/KM7UJ/2/

和较慢的版本:http://jsfiddle.net/KM7UJ/3/