Documentation

BX.easing.prototype.animateProgress

This method is rarely used. It launches an animation the same way as the animate method does, but the progress handler function is called at each iteration instead of step handler function. It does not use sets of start and finish values. The value that changes from 0 at the start of animation to 1 at the end is passed to the 'progress' handler function.

var button = BX("my-button");
var leftMax = 100;
var opacityMin = 0;
var easing = new BX.easing({
{
	duration : 4000,
	transition : BX.easing.makeEaseOut(BX.easing.transitions.quart),
	progress : function(progress)
	{
		button.style.left =  Math.round(leftMax * progress) + "px";
		button.style.opacity =  (100 + Math.round((opacityMin - 100) * progress)) / 100;
	},
	complete : function()
	{
		button.style.background = "green";
	}
});
easing.animateProgress();


© «Bitrix24», 2001-2024