Lightweight JavaScript Library For CSS3 Animations – amo.js

Preview:

Description:

amo.js is a simple tiny JavaScript library which helps you easily and quickly create CSS3 animations with @keyframes rules. You do not care about the css animation’s class and keyframes’s style, focusing on animation is the only thing you need to do.

How to use it:

Download, unzip and include the amo.js library in your document.

<script src="src/amo.js"></script>

Create a CSS3 based animation.

var rotateAnim = Amo.keyframes({
    '-webkit-transform': 'rotate(0deg)'
}, {
    '-webkit-transform': 'rotate(360deg)'
}).animate({
    duration: 5000,
    easing: 'linear',
    time: -1
});

Apply the animation on an element.

rotateAnim.run(document.getElementById('runner'));