@olton/animationjs

The small library for animation html elements

Usage no npm install needed!

<script type="module">
  import oltonAnimationjs from 'https://cdn.skypack.dev/@olton/animationjs';
</script>

README

David GitHub code size in bytes GitHub release License: MIT

AnimationJS - Animate HTML elements

AnimationJS is a javascript class designed to animate html elements.

Contributing

Clone repository / Get source

git clone https://github.com/olton/animationjs

Install dependencies

npm i
yarn add

Run tests

yarn test
npm test

Install

With npm

npm install @olton/animationjs --save-dev

With yarn

yarn add --dev @olton/animationjs

Using

Example

import {animate} from "../src";

const field = document.querySelector(".wrapper");
const w = field.clientWidth, h = field.clientHeight;
const ball = document.querySelector(".ball");

// Move ball left
animate({
    el: ball,
    draw: {
        left: [0, w - ball.clientWidth]
    },
    dur: 2000,
    ease: "easeOutQuad",
    loop: true
});

// Drop ball down
animate({
    el: ball,
    draw: {
        top: [0, h - ball.clientHeight]
    },
    dur: 2000,
    ease: "easeOutBounce",
    loop: true
});

// Rotate ball
animate({
    el: ball,
    draw: {
        rotate: 360
    },
    dur: 1200,
    loop: true
});

Documentation

You can find the documentation at this link.

License

This software is free to use under the MIT license. See the LICENSE file for license text and copyright information.