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!');
  },
});

Released under the MIT License.