jquery負載預加載背景圖像

我有一個容器，持有3個標籤，當點擊一個標籤，容器得到一個新的類 - 當它獲得類，它改變了CSS中的backgroundImage，它改變了在標籤容器中的內容 - 我的問題是背景圖像它相當沉重，它的PNG文件，因爲我需要的透明度，所以我不能將它們更改爲JPG的左右...jquery負載預加載背景圖像

所以我想知道如果有是一種方式，我可以預先加載背景圖像，然後更改tab容器中的內容，也許使用.load（）函數或類似的東西？我到目前爲止的腳本是：

$(".tabs-content div.tabpage").hide(); // Initially hide all content 
$(".tabs li:first").attr("id", "current"); // Activate first tab 
$(".tabs-content div:first").fadeIn(); // Show first tab content 
$('.tab-container a').click(function(e) { //If only tabs, change to .tabs a 
    e.preventDefault(); 
    var className = $(this).attr("name") 
    $(document).find(".tab-container").attr("class", "grid_9 tab-container " + className); 
    if ($(this).closest("li").attr("id") == "current") { //detection for current tab 
     return 
    } else { 
     $(".tabs-content div.tabpage").hide(); //Hide all content 
     $(".tabs li").attr("id", ""); //Reset id's 
     $(this).parent().attr("id", "current"); // Activate this 
     $('#' + $(this).attr('name')).fadeIn(); // Show content for current tab 
    } 
});

來源

2013-07-02 nuffsaid

檢查此http://stackoverflow.com/questions/476679/preloading-images-with-jquery，它不必作爲背景圖像預加載。預加載它，然後將它作爲背景圖片應用會很好。只需將它們預加載到任何功能之外，便可立即進行預加載。 – smerny

呃，在那裏有一千個答案:)哪一個是正確的？ :) – nuffsaid

他們中的大多數人可能會工作，嘗試與票最多的人。 – smerny

您可以使用JavaScript Image對象。像這樣：

var img = new Image(); 
img.src = "http://yourserver/yourimage";

這將加載圖像。這裏更多信息（但我沒有檢查文章自己的內容）：http://perishablepress.com/3-ways-preload-images-css-javascript-ajax/

來源

2013-07-02 12:23:10 enur

這可能是最簡單的方法可以讓你預載的圖片：

$.fn.loadImages = function() { 
    this.each(function(){ 
     $('<img/>')[0].src = this; 
    }); 
} 

$.loadImages(['your-image.png','your-image2.png','your-image3.png']);

如果還是不行，請嘗試加載它們像jquery.load內：

$.fn.loadImages = function() { 
    this.each(function(){ 
     $('<img/>')[0].src = this; 
    }); 
} 

$(window).load(function(){ 
     $.loadImages(['your-image.png','your-image2.png','your-image3.png']); 
});

來源

2013-07-02 12:27:30

$（ 'IMG'）ATTR;（「SRC」，「URL這裏！」）

來源

2013-07-02 12:29:45 WinHtaikAung

您可以加載一個隱藏的圖像，並在圖像加載完成後進行更改，請檢查此question的answer，我想避免重複它已經在SO中的代碼。

來源

2013-10-07 10:44:11 Esteban

jquery負載預加載背景圖像

回答

相關問題