На этом шаге мы приведем общие сведения об эффектах, создаваемых разработчиком.
Помимо методов, реализующих встроенные анимационные эффекты, библиотека jQuery предоставляет мощный метод .animate(), позволяющий нам создавать свои собственные анимационные эффекты с возможностью тонкого управления ими. Метод .animate() обеспечивает два варианта использования. В первом он принимает до четырех аргументов:
- Отображение с набором свойств и значений стилей, напоминающее отображение, используемое при вызове метода .css(), обсуждавшегося на 50 шаге.
- Необязательный параметр скорости, который может быть одной из предопределенных строк или числом, указывающим продолжительность эффекта в миллисекундах.
- Необязательный тип перехода - этот дополнительный параметр будет рассматриваться позже.
- Необязательную функцию обратного вызова - об этом аргументе будет рассказываться чуть позже.
Вызов метода со всеми четырьмя аргументами выглядит, как показано ниже:
.animate({property1: 'value1', property2: 'value2'},
speed, easing, function() {
alert('Анимация завершена.');
}
);
Вторая форма метода принимает два аргумента: отображение со свойствами и отображение с параметрами.
.animate({properties}, {options})
В действительности второй аргумент в этом случае заключает в себе со второго по четвертый аргументы первой формы вызова метода и добавляет еще два параметра. Если разбить аргументы на отдельные строки для большей удобочитаемости, вторая форма вызова метода будет выглядеть, как показано ниже:
.animate({
property1: 'value1',
property2: 'value2'
}, {
duration: 'value',
easing: 'value',
complete: function() {
alert('Анимация завершена.');
},
queue: boolean,
step: callback
});
Пока что мы будем использовать первую форму вызова метода .animate(), но мы еще вернемся ко второй форме в последующих шагах, когда будем рассматривать вопрос постановки эффектов в очередь.
На следующем шаге мы рассмотрим переключение эффекта проявления/растворения.
