Image Loader во время AJAX/JSON процесса

Question

Я пытался получить загрузчик изображение, чтобы показать, что будет охватывать весь документ во время ajaxStart и скрывается на ajaxStop следующим образом:

Сценарий:

$(this).ajaxStart(function(){ 
     $().addClass('imageLoader'); 
    }); 

    $(this).ajaxStop(function(){ 
      $().removeClass('imageLoader'); 
    }); 

CSS:

.imageLoader { 
background: #f5f3e5 url('images/common/loading.gif') 50% no-repeat; top } 

Он не показывает изображение, как задумано, хотя я знаю ajaxStart/Stop работают, когда я тестировал его с какой-либо другой образец кода (т.е. изменение некоторых цвет текста на красный).

Есть ли лучший способ реализации этого? Я не могу понять, в чем проблема.

Answer 1

Было бы проще, если бы вы создали скрытый DIV с классом и показать/скрыть это

<div style="display:none" class="imageLoader" id="loader"></div> 

$(this).ajaxStart(function(){ 
     $('#loader).show(); 
    }); 

    $(this).ajaxStop(function(){ 
     $('#loader).hide(); 
    });