Minimal jQuery Loading Overlay & Spinner Plugin - Easy Overlay

File Size: 22.4 KB
Views Total: 23197
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Minimal jQuery Loading Overlay & Spinner Plugin - Easy Overlay

Easy Overlay is a ultra-simple jQuery plugin allows you to create a loading overlay with a loading spinner on any element. Great for indicating the ajax loading progress inside a container.

How to use it:

1. Include the jQuery library and the jQuery easy overlay's script in the document.

<script src="//"></script>
<script src="jquery.easy-overlay.js"></script>

2. Include the required Font Awesome 4 for the loading spinner.

<link href="//" rel="stylesheet">

3. Call the plugin to create a loading overlay covering the given container with CSS class of 'demo'.


4. The method to close the loading overlay.


5. Customize the loading overlay.


  //The default z-index of the overlay is 99999
  zindex: 60000, 

  // true: Show the fontawesome loading spinner
  // false: No spinner will be shown
  // { url: 'image-web-url', width: 'image-width', height: 'image-height' }: A custom spinner, with an image from a url; sizes can be specified with units or percentages
  spin: true,   

  //Time in miliseconds for the fadeIn or fadeOut effects of the overlay.
  delay: 400     

Change log:


  • Custom image for spinner, with custom dimensions


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