jQuery爲動畫預加載圖像

我知道有一堆jQuery預加載線程，並且我已經閱讀了大部分代碼，但仍然無法找到解決我的問題的方法。jQuery爲動畫預加載圖像

我有一個「停止運動」動畫，它是通過使用隊列和基於圖像的順序命名的jQuery構建的。我不想運行這個動畫，直到它所需的所有圖像都被加載完畢。由於不同的產品類型有不同的動畫，並且所有的圖像都已經由客戶端生成，因此目前並不是一種選擇。

在力矩My預加載代碼是如下：

function preloadImages($img, $frames){ 
    var $imgsrc = $img.attr("src"); 
    var $getext = $imgsrc.split('.'); 
    var $ext = $getext[1]; 
    var $exploded = $getext[0].split('_'); 
    var $newsrc = ""; 
    for (var i=1; i <= $frames; i++){ 
     for (var j=0; j < $exploded.length-1; j++){ 
      $newsrc = $newsrc + $exploded[j] + "_"; 
     } 
     $newsrc = $newsrc + i + "." + $ext; 
     var image_preload = new Image(); 
     image_preload.src = $newsrc; 
    } 
}

如肋骨是總的圖像的數量的序列（6或12在該階段）中，以及用於圖像的命名約定是如下：

Brand_Product_Category_ProductID_SequenceNo.jpg。

我想要做的不是加載保存起始圖像的div，直到所有這些圖像已經使用下面的文檔準備好的片段被預加載，但是這似乎不能正常工作，即，在預先載入所有需要的圖像之前顯示持有人，因此動畫不能流暢運行。

$(".holder").hide(); 
preloadImages($(".holder img"), 6); 
$(".holder").fadeIn("slow");

我想我需要某種回調，但我不知道如何實現它。

來源

2010-12-15 pingu

你現在的代碼有什麼問題？ – 2010-12-15 01:09:37

圖像預加載之前顯示持有人 - 編輯我的問題以包含此內容。 – pingu 2010-12-15 01:29:18

你的命名約定是什麼？爲什麼你用$符號加前綴所有變量名？（這有點令人困惑） – 2010-12-15 01:31:05

問題是這樣的：

當值賦給一個Image對象的src領域，它不只是：改變src屬性。瀏覽器仍然需要從src屬性指向的任何地方加載圖像。

您可以爲Image的'load'事件定義一個處理程序...因此您需要沿着這些行使用某些東西。

一種方法是定義需要加載的圖像列表。每次加載圖像時，都要在數組中設置一個標誌。定期檢查數組，並且一旦設置了所有標誌，指示所有圖像都已加載，您可以淡入div。

來源

2010-12-15 01:41:46 Dancrumb

jQuery爲動畫預加載圖像

回答

相關問題