jQuery Plugin For Loading Indicators On Specified Elements - loadingImageThingy

loadingImageThingy is a jQuery plugin to display a loading indicator (image or CSS powered spinner) which which covers a specified elements or the whole page.

How to use it:

1. Load jQuery library and the jQuery loadingImageThingy plugin's CSS & JS files in your document.

<script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
<link rel="stylesheet" href="jquery.loadingimagethingy.css">
<script src="jquery.loadingimagethingy.js"></script>

2. Add a custom loading indicator to element where this plugin is initiated.

$("#container").loadingimagethingy('enable');

3. Available options.

// the background color of the overlay in any format you want
overlayBackgroundColor: "rgba(0,0,0,0.5)", 

// css3|image
imageType: "css3", 

// either null or the path as string
imagePath: "", 

// image height as int
imageHeight: 128, 

// image width as int
imageWidth: 128, 

// floatingcircles or circularg
animation: "circularg", 

// the text under the animation (if any)
message: "" 

4. Public methods.

// Enable the loading indicator
$("#container").loadingimagethingy('enable');

// Disable the loading indicator
$("#container").loadingimagethingy('disable');

// Destroy the plugin
$("#container").loadingimagethingy('destroy');

Change log:

v1.1 (2015-03-31)

• fixed weird formatting

---

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