JavaScript animation library – aniJS

Sprite animation with JS and CSS. AniJS is a JavaScript animation library, used to create a cross browser image animations.

Raise your web design with JavaScript animation library

The most easy and quick way to Raise your web! Main advantages are, among others, a better integration between coders and designers, it’s easy to use and speed up the development. Small size and there is no need for third party libraries.

Work well on mobile! In iPad, iPhone, Android and the modern browsers.

AniJS animations in JavaScript
AniJS animations in JavaScript

Using aniJS JavaScript animation library

Include aniJS:

<script src="anijs-min.js"></script>

Optionaly you can include some CSS animation definitions:

<head>
  <!-- AniCollection.css library -->
  <link rel="stylesheet" 
    href="http://anijs.github.io/lib/anicollection/anicollection.css">
</head>

Add data-anijs tag to any HTML element:

<body>
    <header data-anijs="if: click, do: flipInY animated">
        header
    </header>
    <nav data-anijs="if: scroll, on: window, 
        do: swing animated, to: footer">
        nav
    </nav>
    <div id="main" data-anijs="if: mouseover, on: body,
        do: swing animated">
        if: load, on: window, do: swing animated
    </div>
    <footer>
        footer
    </footer>
    <script src="anijs-min.js"></script>
</body>

License: MIT

Demos:

http://codepen.io/darielnoel/pen/trnzk

http://codepen.io/darielnoel/full/uJLGb

Project page on GitHub:

http://anijs.github.io

See also:

Other resources from category Animation

Enjoy!

Share:Share on Facebook1Share on Google+1Tweet about this on TwitterShare on LinkedIn2Pin on Pinterest1