Display loading indicator on Ajax calls application-wide

How to display loading indicator on all Ajax request application-wide quick and simple ?

1. Register handler to be called when Ajax requests start and complete

$(document).ajaxStart(function () {
    $("#load_indicator").show();
}).ajaxStop(function () {
    $("#load_indicator").hide();
});

2. Create animated gif you want to display

You can use for example http://ajaxload.info/

3. Create image with animated gif in header

<img id="load_indicator" src="~/images/ajax-loader.gif">

Now on every Ajax request animated gif will show in header and when all requests are completed it will hide. That is all.