IE凍結GIF動畫時DOM插入

Question

我的代碼中有一個GIF動畫（加載圖片）

我得到的html頁面中的一個變量「數據」從Ajax調用。

$("#content").html(data); // takes about 5 seconds and the GIF animation freezes since IE is single threaded. 

是否有寫被用的setTimeout/setInterval函數線，數據線，使線被釋放的一瞬間，使動畫持續的方式？

小提琴網址： http://jsfiddle.net/deepakssn/Kp2bM/

替代的解決方案我想：

<style> 
#loading { 
     background: url(loading.gif) no-repeat center center #fff; 
     display: block; 
     position: fixed; 
     height: 500px; 
     width: 500px; 
} 
</style> 
<script src="../scripts/jquery.js"></script> 
<script> 
$(window).load(function() { 
    function writeData(data) { 
     var yourLines = data.split("\n"); 
     for (var i = 0, j = yourLines.length; i < j; i++) {    
      var x = setTimeout(function() {     
       $("#content").append(yourLines[i]); 
       console.log("Line No :"+[i]+" "+Date.now());     
      }, 5000); 
     }   
    } 
    function ajaxLoad() { 
      $.ajax({ 
        url: "test.txt" 
      }).done(function (data) {       
        console.log("success"+Date.now()); 
        writeData(data); 
        //$("#content").html(data); 
        console.log("loaded data"+Date.now()); 

      }); 
    } 
    ajaxLoad(); 
}); 
</script> 
<div id="loading"></div> 
<div id="content"></div> 

Answer 1

我就遇到了這個問題，同時增加了 '裝載' 指標爲我的項目之一。我用this爲我解決了這個問題。由於它不是圖像，因此不會凍結。