Индикатор загрузки изображения на jQuery

В данном посте я хотел бы рассказать как сделать простой индикатор загрузки изображения используя библиотеку jQuery.

Чтобы сделать индикатор загрузки изображения понадобится 3 метода:
1. load — в случае успешной загрузки
2. error — в случае ошибки
3. attr — для смены src изображения.

Итак, допустим мы имеем конструкцию

<div>
  <div style="top:50%; left:50%;position:absolute;" id="loader"><img src="/loader.gif" /></div>
  <img id="testImage" src="/test.jpg" onclick="changeImageTo('/test2.jpg');" />
</div>

Функция changeImageTo:

function changeImageTo( NewSrc )
{
   $('#loader').show();
	
  $('#testImage').load(function () {
    $('.loader').hide();
  }).error(function () {
    $('.loader').hide();
  }).attr('src', NewSrc );
}

Вот как-то так.
Прошу строго не судить.

Автор: Sect0R