tweeen

Allows to «animate» number values with given duration

Usage no npm install needed!

<script type="module">
  import tweeen from 'https://cdn.skypack.dev/tweeen';
</script>

README

Primitive tween function

Allows to «animate» number values with given duration

Usage

import tween from 'nano-tween';

const stop = tween(1, 100, (value) => {
  console.log(value);
}, {
  duration: 1000,
});

Params

Signature of tween function

function tween(
  from: number,
  to: number,
  cb: (value: number) => void,
  params?: TweenParams,
);

List of params

  • duration — duration in ms, defaults to 300
  • easing — simple easing function that takes one argument — time (from 0 to 1). Defaults to linear. You can use functions from eases or similar package
  • fps — defaults to 60
  • end — animation end callback