Webimate

A small (2061 bytes) SCSS and JavaScript library for your websites.

Features

• Animation queuing
• Create custom animations easily with SCSS
• Extensive
• No configuration required

Installation

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/LynithDev/webimate-lib/dist/main.css">
<script src="https://cdn.jsdelivr.net/gh/LynithDev/webimate-lib/dist/main.js" defer>

Usage

Adding an animation to an element is quite simple. Simply add the animate class along with the name of your preferred animation (e.g. fade). You can also add any animation arguments such as left so the element can fade and slide from the left.

Fade from the left example

<div class="animate fade left">Hello World</div>

Animation queuing

To queue animations, add a queue class followed by a = and then the index of where in the queue it should be. (e.g. queue=2 to be second)

Animation queue example

<p class="animate fade left queue=1">I'll animated first</p>
<div class="animate fade left queue=3">I'll be animated last</div>
<div class="animate fade left queue=2">I'll be animated after the p element</div>

License

See MIT License