BX.easing

Описание и параметры

BX.easing(
	options
);

Функция-конструктор.

Параметры функции

Параметр options может содержать следующие настройки:

options = {
	duration : длительность анимации в миллисекундах, по умолчанию 1000ms
	start : стартовый набор значений
	finish : конечный набор значений
	transition : функция-анимации, по умолчанию линейная
	step : функция-обработчик каждой итерации анимации
	complete : функция-обработчик, которая выполнится после окончания анимации
	delay: задержка между итерациями анимации в миллисекундах, по умолчанию 13ms
	progress : функция-обработчик каждой итерации анимации, вызывается только при использовании animateProgress (см. описание ниже)
}

Стартовый и конечный набор значений содержат значения, которые будут изменяться в процессе анимации. Например, если мы хотим плавно показать баннер на странице (высота и прозрачность изменяется от 0 до 100), то в options указываем следующее:

start : { height : 0,  opacity : 0 },
finish : { height : 100, opacity : 100 }

Функция-обработчик step на каждой итерации анимации будет получать Javascript-объект с текущими значениями height и opacity.

Возвращаемое значение

Возвращает объект класса BX.easing.

Примеры использования

var banner = BX("my-banner");
var easing = new BX.easing({
	duration : 500,
	start : { height : 0, opacity : 0 },
	finish : { height : 100, opacity: 100 },
	transition : BX.easing.transitions.quart,
	step : function(state){
		banner.style.height = state.height + "px";
		banner.style.opacity = state.opacity/100;
	},
	complete : function() {
		banner.style.display = "none";
	}
});
easing.animate();