jQuery一次显示一个元素?

时间:2011-07-04 02:41:37

标签: jquery show

我有一个已编制索引类的列表 - 在容器div的淡入淡出时,一次显示这些类的最佳方法是什么?

2 个答案:

答案 0 :(得分:7)

给他们一个公共类,并使用fadeIn()[docs]方法在循环中执行each()[docs],同时使用delay()[docs]方法将每个方法延迟给定的持续时间乘以索引循环。

$('li.someClass').hide().each(function( i ) {
    $(this).delay( i * 400 ).fadeIn();
});

每个元素将比前一个元素晚400毫秒开始。

示例: http://jsfiddle.net/4ANCj/

答案 1 :(得分:3)

function fade_in_recursive(e,duration,callback)
{
    $(e).fadeIn(duration,function()
    {
        if($(e).next().length == 0)
        {
            if(typeof(callback) == 'function')
            {
                callback();
            }
            return;
        }
        else
        {
            // Apply recursion for every sibling.
            fade_in_recursive($(e).next(),duration,callback);
        }
    });

} // End fade_in_recursive

$(function()
{
    fade_in_recursive($('ul li:first-child'),500);
});

http://jsfiddle.net/2s4L8/