Animate

Bare bones animation helper.

How to use

Install the library via NPM:

npm install @fczbkk/animate --save

Then use in your project like this:

import createAnimation from '@fczbkk/animate';

// animate left position of an element from 0px to 200px in 0.5s
const my_animation = createAnimation({
  duration: 500,
  onTick: updateElementPosition(position) {
    document.querySelector('#my_element').style.left =
      (position * 200) + 'px';
  }
});

my_animation.start();

Documentation

AnimationConfig

Animation

Class representing the animation.

constructor

Create animation.

Parameters

• custom_config [AnimationConfig](default {})

isRunning

Returns true if animation is running.

Returns boolean

isPaused

Returns true if animation is paused.

Returns boolean

start

Starts the animation. If the animation was running prior to starting, it will be stopped first.

stop

Stops running animation. If animation is not running, nothing happens.

pause

Pauses running animation. If animation is not running, nothing happens.

resume

Resumes paused animation. If animation is not paused, nothing happens.

getPosition

Returns current position of animation. If animation is not running, returns zero.

Returns number Value between 0 (start) and 1 (end).

updateConfig

Updates animation config with new values. Unknown values will be ignored.

Parameters

• config [AnimationConfig](default {})

Bug reports, feature requests and contact

If you found any bugs, if you have feature requests or any questions, please, either file an issue at GitHub or send me an e-mail at riki@fczbkk.com.

License

Animate is published under the MIT license.