Simplest Ajax Loader With jQuery And CSS3 - jmspinner
File Size: | 3.23 KB |
---|---|
Views Total: | 15192 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
jmspinner is a really simple jQuery plugin that shows a CSS3 powered loading indicator while data in specific area is loading via AJAX requests.
How to use it:
1. Load the stylesheet 'jm.spinner.css' for the animated loading indicator.
<link href="jm.spinner.css" rel="stylesheet">
2. Load jQuery library (slim build) and the JavaScript file at the end of the document.
<script src="//code.jquery.com/jquery-3.2.1.slim.min.js"></script> <script src="jm.spinner.js"></script>
3. Enable the loading indicator in a specific container.
$('.box').jmspinner();
4. Or even the whole document.
$('body').jmspinner();
5. Apply your own styles & position to the loading indicator:
.spinner { ... }
6. Change the default size of the loading indicator:
// large $('.box').jmspinner('large'); // small $('.box').jmspinner('small');
7. Remove the loading indicator when the data is completely loaded.
$('.box').jmspinner(false);
This awesome jQuery plugin is developed by pejonic. For more Advanced Usages, please check the demo page or visit the official website.