Question

还有比这更好的方法吗？请让我向你学习。 TIA

$('ul').children(':first-child').delay('fast').fadeToggle('fast', function () {
    $(this).delay().fadeToggle(function () {
        $(this).next().delay().fadeToggle(function () {
            $(this).delay().fadeToggle(function () {
                $(this).next().delay().fadeToggle(function () {
                    $(this).delay().fadeToggle(function () {
                        $(this).closest('#welcome').next().toggle();
                        $(this).closest('#welcome').slideToggle(function () {
                            $(this).remove();
                            $('body').css('overflow', 'auto');
                        });
                    });
                });
            });
        });
    });
});

http://jsfiddle.net/rKVkd/

Answer 1

尝试

$('#welcome, #content').height($(window).height());

function toggleUl($ul, complete) {
    var $li = $ul.find('.current').removeClass('current').next();
    if (!$li.length) {
        $li = $ul.children().first();
    }
    $li.addClass('current')
    $li.fadeIn('fast', function () {
        $(this).delay(250).fadeOut('fast', function () {
            var $this = $(this);
            if ($this.is(':last-child')) {
                complete();
            } else {
                toggleUl($ul, complete);
            }
        })
    });
}

toggleUl($('ul'), function () {
    $('#welcome').next().toggle();
    $('#welcome').slideToggle(function () {
        $(this).remove();
        $('body').css('overflow', 'auto');
    });
});

演示：Fiddle

Answer 2

试试这个，您可以将flash_show应用于任何列表以实现相同的效果。当节目结束时，将调用一般回调。

Demo

function flash_show(cb) {
    var $e = $(this).next();

    $(this).fadeToggle().delay().fadeToggle('fast', function () {
        $e.size() == 0 ? cb.call(this) : flash_show.call($e, cb);    
    })
}

flash_show.call($('ul li')[0], function () {
    $(this).closest('#welcome').next().toggle();
    $(this).closest('#welcome').slideToggle(function () {
        $(this).remove();
        $('body').css('overflow', 'auto');
    });
})

JQuery最佳实践：按顺序在元素之间运行效果

2 个答案: