Create Engaging Experience with Speed ⚡️

Animax provides a set of modules that makes it super easy for developers to create web animations.

Table of Contents
Technologies
Resources/Links
Introduction
- Getting Started
- Features
Usage Examples
Development
Active Members
Sponsors
License

Technologies

Resources/Links

Introduction

Animax is a library of ready-to-use, cross-browser animations for use in your web projects. Suitable for emphasis, home pages, sliders, attention-guiding hints, and simply spicing up your products.

Getting Started

Stepping the into world of web animations might seem scary and intimidating at first, but don't worry, we've got you. Our platform was designed and engineered to make the experience a pleasant and intuitive one.

You can find the Animax documentation on here.

Features

Normal language: The name of the animations are very close to normal human language, and user do not need to write any code at all.
Ease of Styling: Animax.css contains a set of CSS selectors like bounce-1x and move-up that makes it easy to animate your HTML elements by passing the relevant ID or class.Easily export code for Web (HTML/CSS/JS) or SVG and watch your design comes to life.
Light and user-friendly: The library was built using plain CSS, and no use of external libraries that might reduce your project's performance.
Production-ready animation library: Less coding, and more producing. Animax is an animation library that’s built for production. It support all major web browsers.

Usage Examples

Download the library.
Extract the zipped file.

Import the library into your project using the link tag.

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://github.com/zuri-training/anima_lib_team98/blob/develop/animax.css">

<title>Home</title>
</head>
<body>

........

<script src="https://github.com/zuri-training/anima_lib_team98/raw/develop/animax.js"></script>
</body>
</html>

Add the animation ID, which is bounce-1x in this instance, to the HTML element you would like to animate.
```
<body>

........

<div id="bounce-1x"></div>

........

</body>
```
Voila, the element is automatically animated.

bouncing ball

Development

See DEVELOPMENT.md for development docs.

Active Members

Designers	Developers
Tobechukwu Eloke	Charles Precious
Tomi Etta	Mustapha Balogun
Zainab Bodude	Aroso Emmanuel Adedeji
Khadijat Bakare	Oguagu Ekenechukwu Daniel
Coker Adebusola	David Alatishe
Victor Roosevelt	Oluji Onyekachukwu
Fatoye Ruth
Aminu Musa Ambursa
Olamilekan Phillip
Joshua Opeyemi Adebisi
Salau Shukurat

zuri-training / anima_lib_team98

readme