Реализация переходов в очередях

Очередь — это раздражающие длинные строки, которые гарантируют правильное выполнение входящих в них компонентов. Анимационная очередь в jQuery работает аналогичным образом, обрабатывая анимационные запросы для каждого объекта в порядке их поступления. Иногда может возникнуть ситуация, когда необходимо форсированно обработать конкретный запрос, а не простаивать в очереди в бесполезном ожидании.

Мы уже видели, что функции .animate() наряду со свойствами CSS можно передавать различные дополнительные параметры, указывающие на продолжительность (duration — slow, fast, числовое значение в миллисекундах) и тип динамики (easing — swing, linear, и т.д.).

Логический параметр queue позволяет указать, должна ли функция анимации ждать своей очереди или нет. Чтобы осуществить несколько различных типов анимации для одного объекта, можно установить параметр queue в false. Это позволит отключить очередность выполнения.

Для использования queue требуется расширенный синтаксис, который позволяет выделить каждый дополнительный параметр:

...
jQuery('.post:first')
    .hide()
    .fadeTo(0, .1)
    .css("height","5px")
    .animate({
        height: '+=500px',
     },
     {
        duration: 4000,
        easing: 'swing',
        queue: false
     }
    )
    .fadeTo(4000, 1);
...

Следующий скриншот демонстрирует постепенное исчезновение записи, во время которого изменяется ее высота.