$('#loading').bind('ajaxStart', function() {
	var n = $(this);
	n.data('state', 'started');
	setTimeout(function() {
		if (n.data() && n.data().state == 'started') {
			n.slideDown(500);
		}
	}, 300);
}).bind('ajaxStop', function() {
	var n = $(this);
	n.data('state', 'stopped');
	n.slideUp(500);
});

$('#loading').bind('ajaxStart', function() {
	var n = $(this);
	n.data('state', 'started');
	setTimeout(function() {
		if (n.data() && n.data().state == 'started') {
			n.slideDown(300);
		}
	}, 300);
}).bind('ajaxStop', function() {
	var n = $(this);
	n.data('state', 'stopped');
	n.slideUp(300);
});

jQuery bindings for showing and hiding a div during AJAX requests.  The div will not show unless the AJAX request takes a certain amount of time (in this case 300ms).  This will reduce the flicker effect of showing and hiding throbbers.

Binding throbber div for jQuery AJAX requests

jquery

jQuery