jQuery Plugin To Apply Animate.css Animations On Page Load - anim-js

The small anim-js jQuery plugin gives you complete control over the Animate.css based CSS3 animations on page load.

How to use it:

1. Load the required Animate.css in the head section of your html document.

<link rel="stylesheet" href="/path/to/animate.min.css">

2. Load jQuery library and the JavaScript file at the end of the document so the page loads faster.

<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="anim-js.min.js"></script>

3. Add the CSS class 'anim-js' and an animation class of your choice to the element.

<div class="anim-js tada">Content Goes Here</div>

4. Config the animation with the following data attributes:

• data-ajs-duration: the duration in seconds
• data-ajs-delay: start animation x seconds after page load
• data-ajs-loop: how many times the animation should run

<div class="anim-js tada"
     data-ajs-duration="1s" 
     data-ajs-delay="1s" 
     data-ajs-loop="3">
     Content Goes Here
</div>

---

This awesome jQuery plugin is developed by De-paule. For more Advanced Usages, please check the demo page or visit the official website.