Skip to content

1. Initialize tween

Anton Kosykh edited this page Jan 16, 2018 · 4 revisions

Using NanoTween.update()

NanoTween uses NanoTween.update global method to handle ticks.
So you can copy-paste this code to initialize NanoTween:

import NanoTween from 'nanotween'

const animate = (time) => {
  requestAnimationFrame(animate)
  NanoTween.update(time)
}
animate(performance.now())

So we just use requestAnimationFrame and performance.now and are happy

Create new tween

All that you need - use new NanoTween().

const tween = new NanoTween()
  .duration(1000)
  .easing(x => x)
  .reverse()

All NanoTween methods returns this so you can write nice declarative code

Remove tween

If you don't need some tween, you can use:

tween.remove()

It will completely remove tween from queue.

WARNING: it will stop tweening on current progress and you won't be able to continue it.
If you want to continue animation later, use .stop/pause() methods.
.stop/pause() won't remove tween but just leave it ignored in NanoTween.update()


See also: API reference

Clone this wiki locally