確定身體的背景圖片（CSS）是否已經被加載

Question

在某些條件下，不同的背景圖像加載：

$('body').css('background','url(image.png)'); 

有沒有辦法來確定背景圖像是否已加載？當圖像被加載時，我需要執行一個函數。

Answer 1

您可以將圖像加載到一個隱藏<img>標籤和分配onload處理程序的標籤。在onload處理程序中，可以填充正文的背景圖像（因爲圖像現在位於瀏覽器緩存中，所以應該或多或少地立即發生），然後運行自定義代碼。

var hiddenImg = new Image(); 
hiddenImg.onload = function(){ 
    $('body').css('background','url(' + this.src + ')'); 
    your_custom_onload_code(); 
}; 
hiddenImg.src = 'image.png'; 

Answer 2

var img = new Image(); 
img.onload = function() { $('body').css('background','url(image.png)'); }; 
img.src = src;