Unobtrusive Loading Screen & Loading Bar - JQLoader

A lightweight and simple-to-use jQuery plugin to create a fullscreen loading indicator or a bottom loading bar on the page.

Can be used to display an unobtrusive loader & preloader on your page or a specific container while something is being loaded into the current document.

How to use it:

1. Add the JQLoader plugin's JavaScript and CSS files to the webpage.

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

2. Display a fullscreen loading indicator on a container element or on the whole page.

$(".div_sample").JQLoader();
$("body").JQLoader();

3. Display a bottom loading bar instead.

$("body").JQLoader({
  theme: "bottom"
});

4. Determine whether to show a fullscreen overlay when the loading indicator is activated.

$("body").JQLoader({
  mask: true
});

5. Customize the text & background colors of the bottom loading bar.

$("body").JQLoader({
  background: "#444",
  color: "#fff"
});

6. Close the loading screen & loading bar.

$("body").JQLoader({
  action: "close"
});

---

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