jQuery Loading Overlay Plugin Example

Download This Plugin Back To jQueryScript

A jQuery plugin for AJAX loading that adds a loading overlay with loading text and loading spinner to a given element when loading something.

Javascript:

$('.add-loading').click(function () {
  target.loadingOverlay();
});
$('.remove-loading').click(function () {
  target.loadingOverlay('remove');
});
        

HTML without overlay:

<div id="target"></div>

HTML with overlay:

<div id="target" class="loading">
  <div class="loading-overlay">
    <p class="loading-spinner">
      <span class="loading-icon"></span>
      <span class="loading-text">loading</span>
    </p>
  </div>
</div>