ANIMATION > CALLBACKS

Callbacks

Pass begin, update, and complete to animate(). The update callback receives { target, progress, time }.

Accepts

A Function. For update, the first argument is an object: { target, progress, time }.

Default

noop

INFO

Callbacks are configured per animation via the params object.

const $ = animal;
$('.box').animate({
  x: 200,
  update: ({ progress }) => console.log(progress)
});
            

Callbacks code example

JavaScript

HTML

const $ = animal; const $value = document.querySelector('.value'); let updates = 0; $('.circle').animate({ x: '16rem', loop: Infinity, direction: 'alternate', begin: () => $value.textContent = '0', update: ({ progress }) => $value.textContent = Math.round(progress * 100) + '%' });