Skip to content

Documentation / @andrew_l/dom / animateNumber

Function: animateNumber() ​

animateNumber(timing): () => void

Animates a numeric value from from to to over a specified duration, applying an optional timing function.

The animation will continuously update the value using the onUpdate callback until the animation is complete. Once the animation ends, the onEnd callback will be called, if provided.

Parameters ​

timing ​

AnimateNumberProps

The timing function that controls the progression of the animation. Defaults to linear.

Returns ​

A function that can be called to cancel the animation.

() => void

Example ​

ts
animateNumber({
  from: 0,
  to: 100,
  duration: 1000,
  onUpdate: (value) => {
    console.log(value); // Updated value on each frame
  },
  onEnd: () => {
    console.log('Animation complete!');
  },
});