javascript - Loading spinner on Ajax call -

i have ajax script fetch query file , load new content file on database update. how go adding loading spinner script?

< div id = "ajaxloader" >    < h1 > loading < /h1>  </div >    < div id = "feed_main_load" >        < /div>

var $loading = $('#ajaxloader').hide();  $(document)    .ajaxstart(function () {      $loading.show();    })    .ajaxstop(function () {      $loading.hide();    });       $(document).ready(function() {         $("#feed_main_load").load("elements/feedloadtest.php");         var refreshid = setinterval(function() {            $("#feed_main_load").load("elements/feedloadtest.php?" + 1*new date());         }, 60000);      });

what have show spinner before call $.load,

and hide in completion callback.

you have here full snippet:

 $(document).ready(function() {     $(img).hide();           $("#feed_main_load").load("elements/feedloadtest.php");         $(img).show();           var refreshid = setinterval(function() {            $("#feed_main_load").load("elements/feedloadtest.php?" + 1*new date(), function(){     $(img).hide();  });         }, 60000);      });

<img src="https://d13yacurqjgara.cloudfront.net/users/135058/screenshots/950508/spinny_2x.gif" width=64 height=64/>  <div id="feed_main_load">      </div>