Jquery allow cursor to progress before document.ready function

Question

In my project i want the cursor to progress state before document ready function and after the entire page is rendered it need to change the cursor to default state.

 (function($) {
    $('body').css('cursor','progress');  
    $(document).ready(function() {
    $('body').css('cursor','progress'); }

This my code can anyone please help me out

Answer 1

What you could do is something like this add a css rule for the body cursor

<style>
html {
  cursor: progress;
}
<style>

then just change the cursor again when page finish rendering all the contents.

$(window).on('load',function() {
    $('html').css('cursor','default'); 
}

Answer 2

At first, declare CSS style on head tag for force the cursor to waiting.

<style>
html {
  cursor: progress;
}
<style>

Next, use JQuery to change cursor to default after content load.

$(document).ready(function() {
    $('html').css('cursor','default'); 
}

Good luck !