jquery - 项目一项一项地淡出/淡出？

Question

我有一个 ID 为“blog-container”的包含 div，以及其中的一组子 div，其类为“blog-item”。

我想要做的是将“博客容器”中的所有“博客项目”一一淡出，一个接一个，然后以相同的顺序一一淡入.

有什么想法吗？

Answer 1

jQuery 的 .delay method允许在效果之前添加特定的时间延迟。您可以将其与 .each method 结合起来，将延迟值乘以每个匹配元素的索引 ( live demo ):

var items = $('div#blog-container div.blog-item');

items.each(function(index, element) {
    $(element)
        .delay(index * 600)
        .fadeOut(600)
        .delay(items.length * 600)
        .fadeIn(600);
});