Step и Complete

Дата публикации:Апрель 7, 2011

Последние опции, которые можно передать в функцию .animate(), это step и complete. Параметр step позволяет устанавливать дополнительную функцию, которая может быть вызвана после окончательного выполнения каждого шага анимации (данный параметр оказывается полезным, если вы используете сразу несколько свойств CSS для анимации). Параметр complete позволяет устанавливать функцию обратного вызова, которая будет выполнена по окончании анимационного процесса.

Если вам необходимо сделать так, чтобы анимация началась только после окончального выполнения текущей функции, достаточно воспользоваться параметрами step и complete. Это решение является более предпочтительным, нежели использование функции .delay(). Параметры step и complete позволяют задать точный порядок выполнения функций.

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

Представленный фрагмент позволяет сгенерировать Javascript предупреждения в функции animate.

Лично я никогда не использовал параметр step в своих WordPress проектах, однако я представляю себе, как можно создать с его помощью интересные цепочки эффектов. В отличие от step, параметр complete я применяю в различных анимациях более часто.

Поделиться

Оставить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Получать новые комментарии по электронной почте. Вы можете подписаться без комментирования.