jQuery Plugin For Checking Content Has Been Loaded - is loading
File Size: | 107 KB |
---|---|
Views Total: | 8139 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

is loading is a simple jQuery plugin that checks if all content (or any action) of your web page has been loaded and then triggers a visual feedback to your visitors. It also can disable form elements and put an overlay an specified area or whole page while the loading is active.
Installation:
# Yarn yarn add is-loading # NPM $ npm install is-loading
Basic Usage:
1. Include jQuery library and is loading plugin on the page
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> <script src="jquery.isloading.js" type="text/javascript"></script>
2. The Markup
<div class="demo"> <p class="alert">container</p> <span class="btn">Test Button</span> </div>
3. The javascript
<script> $(function() { // Action on Click $( ".btn" ).click(function() { $( this ).isLoading(); // Load data or whatever $( "p" ).removeClass("alert-success"); // Data Loaded, re-enable event setTimeout( function(){ // Deactivate the loading plugin $( ".btn" ).isLoading( "hide" ); $( "p" ).html( "Content Loaded" ) .addClass("alert-success"); }, 1000 ); }); }); </script>
4. Options
const optionsDefault = { // switch | replace | full-overlay | overlay 'type': 'switch', // Text to display next to the loader 'text': "Loading...", // true | false 'disableSource': true, 'disableList': [] };
Change logs:
2017-03-13
- v2.0.2
2015-02-17
- v1.0.6
2014-10-05
- update
2014-10-01
- Allow hide for multiple elements seperately
This awesome jQuery plugin is developed by hekigan. For more Advanced Usages, please check the demo page or visit the official website.