Jquery loader when server is waiting for response

Question

Good day,

I would like to ask, if is possible with jquery use loader, when I click on any links and waiting for server response for example. This is problem, when server does not respond immediately and we're in dead point. Web site youtube has this problem solved, for example.

Sorry, for my English and thanks

Answer 1

With jQuery, this can be achieved by using the beforeSend parameter in $.ajax:

HTML:

<img id="loader" src="someAnimation.gif" />  <!-- loader animating GIF -->

jQuery:

$("img#loader").hide(); // hide the loader

$.ajax({
  beforeSend: function(){ $("img#loader").show(); },  // show until you get the response
  success: function(){
    $("img#loader").hide();  // hide it again
    /* perform success operations */
  }

});

Readup: http://api.jquery.com/jquery.ajax/