jQuery Plugin To Manage Animate.css Based Animations - animate.css.js

File Size: 17.4 KB
Views Total: 1803
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
jQuery Plugin To Manage Animate.css Based Animations - animate.css.js

animate.css.js is a jQuery/JavaScript helper for Animate.css that helps you manage, control CSS3 animations on modern browsers.

How to use it:

1. Include the necessary animate.css and jQuery library on the html page.

<link rel="stylesheet" href="/path/to/animate.min.css">
<script src="/path/to/jquery.min.js"></script>

2. Include the JavaScript animate.css.js after jQuery.

<script src="animate.jquery.js"></script>

3. Animate your element using a CSS3 animation of your choice.


4. Config the animation with the following options.


  // animation type
  type: null,

  // infinite loop
  infinite: false,

  // reset the element when the animation ends
  reset: true,

  // hide scrollbar
  hideScrollbar: true

5. Advanced usages.

window.animatecssjs({$el: $('#el')}).then(() => {

window.animatecssjs('#el'}).then(() => {

window.animatecssjs('.el1').then(() => {
  return animate('.el2')
}).then(() => {
  return animate('.el3')

Change log:


  • small changes.


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