AJAX 호출을 할 때 GIF 애니메이션이 작동하지 않는 이유는 무엇입니까?

내 목표는 AJAX 호출을하는 동안로드 팝업 (GIF 포함)을 표시하는 것입니다. jQuery UI Modal dialog을 사용하고 있는데, CSS를 사용하여 GIF 애니메이션을 삽입하고 있습니다. AJAX 호출이 시작되기 전에 호출이 끝나 자마자 대화 상자를 열고 닫습니다. 문제는 AJAX 호출이 실행 중이고 모든 브라우저에서 GIF가 작동하지 않는 것입니다. 다음 코드를 사용하고 있습니다 :AJAX 호출을 할 때 GIF 애니메이션이 작동하지 않는 이유는 무엇입니까?

<div id="loadingScreen" title="Loading">Please wait...</div> 

#loadingScreen { 
    background: url(http://regretless.com/stuff/jQuery/images/loading.gif) no-repeat 5px 8px; 
    padding-left: 25px; 
} 

$("#loadingScreen").dialog('open'); 
setTimeout(function() { 
    $.ajax({ 
    type: "GET", 
    url: "testing.txt", 
    async: true, 
    dataType: "text", 
    success: function (returnText) { 
     $("#viewDescription").text(returnText); 
     $("#viewGroupID").text(" " + t.id); 
     $("#loadingScreen").dialog('close'); 
     $('#View').dialog('open'); 
    }, 
    error: function (xhr, status, error) { 
     $("#loadingScreen").dialog('close'); 
     alert("An error has occured"); 
    } 
    }); 
}, 10);

아무도 저에게 어떤 문제가 될 수 있는지 알려주시겠습니까?

출처

2012-07-12 user1135357

하나 이상의 브라우저에서 이것을 재현 할 수 있습니까? 이미지를 애니메이션이 아닌 것으로 다시 작성하는 프록시 뒤에 있습니까? –

GIF가 AJAX 호출 전후에 작동하기 때문에 그럴 수는 없습니다. – user1135357