Ajax Busy

Take new js file in your project named jsbusy.js and add javascript code into this files.

$(function() {
    $('body').append('<div id="jBusy"><p id="ajaxBusyMsg">Please wait...</p></div>');
});
//  bound to ajax start/stop document events
$(document).ajaxStart(function() {
    $('#jBusy').show();
}).ajaxStop(function() {
    $('#jBusy').hide();
});

In Html page:

Take reference into head tag:

jquery-1.4.3.min.js
jsbusy.js

CSS:

Write style into CSS file and take reference into head tag

#jBusy{
  display: none;
  margin: 0px 0px 0px -50px; /* left margin is half width of the div, to centre it */
  padding: 30px 10px 10px 10px;
  position: fixed;
  left: 50%;
  top: 40%;
  width: 200px;
  height: 100px;
  text-align: center;
  background: #e8e8e8 url(images/ajax-loader.gif) no-repeat center center;
  border: 1px solid #000
}

Add image into images folder