一张一张地淡出图块，然后淡入

Question

我有一个 150 像素 x 150 像素的大图块，其中有 9 个较小的 50 像素 x 50 像素图块。我想将小图块一一淡出以显示下面的大图块，然后在大约 3 秒后将每个小图块一一淡入。暂停约 5 秒后应重复此过程。我这里有一个粗略的原型：

http://jsfiddle.net/psivadasan/k34xX/1/

感谢任何帮助。

Answer 1

请参阅下面的代码，DEMO 此处

var $divs, curPointer = 0; curOpacity = 0;
function rotateDivs() {   

    $divs.eq(curPointer++).animate({opacity: curOpacity}, 1000);

    if (curPointer == $divs.length) {
        curPointer = 0;
        curOpacity = (curOpacity == 0)? 1: 0;
        setTimeout(rotateDivs, 5000);
    } else {
        setTimeout(rotateDivs, 3000);
    }
}