Set The Cursor To Wait During AJAX Loading - jQuery waitforit
| File Size: | 2.76 KB |
|---|---|
| Views Total: | 2866 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
waitforit is a small jQuery plugin that sets the mouse cursor to Wait while performing AJAX requests in the document. Only works for window object.
How to use it:
1. Insert the latest version of jQuery library and the jQuery waitforit plugin into your web page.
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha384-tsQFqpEReu7ZLhBV2VZlAu7zcOV+rXbYlF2cqB8txI/8aZajjp4Bqd+V6D5IgvKT"
crossorigin="anonymous">
</script>
<script src="jquery-waitforit.js"></script>
2. Initialize the plugin on the window object and done.
$(function(){
$(window).wait();
});
3. Config the delay & timeout in milliseconds.
$(function(){
$(window).wait({
delay: 500,
timeout: 60000,
});
});
3. Add an extra CSS class to the mouse cursor while loading.
$(function(){
$(window).wait({
cssClass: ''
});
});
4. Append any content to the page while loading.
$(function(){
$(window).wait({
content: '<div id="loading">Loading...</div>'
});
});
5. Execute your own functions when the loading starts and stops.
$(function(){
$(window).wait({
callbacks: {
start: showWaitCursor,
stop: hideWaitCursor
},
ajaxStartFunctions: [],
ajaxStopFunctions: []
});
});
This awesome jQuery plugin is developed by ossipoff. For more Advanced Usages, please check the demo page or visit the official website.











