IE8圖像預加載-jQuery - 加載後做的東西

我有一個圖片庫網站。在允許用戶單擊任何縮略圖之前，我要預先加載17個大圖像。這個想法是，當加載最終圖像時，我可以顯示頁面並確保當用戶單擊縮略圖時，會顯示一個大圖像（並且不會繼續加載）。直到從$ .getScript（）調用中檢索到類似JSON-P的數據時，我才知道圖像URL。IE8圖像預加載-jQuery - 加載後做的東西

所以，我在 http://www.stephentang.net/j/photoModule.js

$.each(self.jsonObj.imageItems, function(index) { 
    $("<img />").attr("src", STP.HOSTNAME + self.jsonObj.imageItems[index].imgSrc).load(function() { 
    num_left_to_load = num_left_to_load - 1; 
    console.log('Left to Load: ' + num_left_to_load); 
    if (num_left_to_load <= 0) { 
     if (typeof callback === "function") { 
      console.log('callback is triggered'); 
      $("#loading-div").remove(); 
      self.jqFilmstrip.css('display', 'block'); 
      self.jqFeaturedPhotoImg.css('display', 'block'); 
      callback.apply(context); 
     } 
    } 
    }); 
});

我已經把一些的console.log（）語句此代碼。在FF3.5 +和Safari中，num_left_to_load達到0，從而觸發回調函數。在IE8（也可能是IE7）中，num_left_to_load永遠不會達到0.結果，頁面停留在「加載...」消息中。

我不是在尋找插件解決方案。

謝謝您的閱讀。

編輯：我刪除了「正在加載...」消息，不再隱藏頁面。看來在IE8中，第一次加載後，圖像被緩存，所以load（）方法似乎不工作，仍然導致計數器未達到0.

編輯：我試過window.ready（），但該窗口很快加載。

編輯：它看起來像第一次加載IE6-8緩存圖像，然後在發出出站請求之前檢查緩存，所以.load（）不一致地工作在他們身上。

來源

2011-08-17 Stephen

你想包裝你的代碼在$(window).ready(function(){...});這將等待所有的圖像加載之前運行其中的代碼。

來源

2011-08-17 16:30:15 maxedison

這似乎不起作用，因爲當我嘗試預載更多圖像時窗口已經加載。 – Stephen

IE8圖像預加載-jQuery - 加載後做的東西

回答

相關問題