Рекомендации JQuery: запускайте эффекты между элементами в последовательности

0

есть ли лучший способ, чем это? Пожалуйста, дайте мне учиться у вас. ТИА

$('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/

Теги:

2 ответа

0
Лучший ответ

Попробуйте это, вы можете применить flash_show к любому списку для достижения того же эффекта. И общий вызов будет вызван, когда шоу будет завершено.

демонстрация

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');
    });
})
  • 0
    классно. Учитесь у вас многому. Спасибо!
0

Пытаться

$('#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');
    });
});

Демо: скрипка

  • 0
    офигенно, спасибо ..

Ещё вопросы

Сообщество Overcoder
Наверх
Меню