jquery的褪色爲背景圖像

我有此標記爲背景圖像：jquery的褪色爲背景圖像

<img src="bg.jpg" id="bg" alt="">

和此CSS：

#bg { position: fixed; top: 0; left: 0; } 
#bg {display:none;}

和這個jQuery：

$(document).ready(function(){ 
$('#bg').load(function() { 
$(this).fadeIn('slow'); 
}); 
});

基本上它工作，但奇怪的情況是，有時圖像加載，有時不，有時我必須刷新頁面幾次。看看here看看我在說什麼。

2011-09-02 alexandru

它每次在Firefox 6.0.1上都能正常工作。 –

看看這個：http://stackoverflow.com/questions/1700864/making-images-fade-in-on-image-load-using-jquery –

可以試試$（window）.load（）...但那麼會出現bg的閃光。 – Chris

問題是圖像在腳本之前加載。所以，當你綁定圖像加載事件的事件處理程序時，圖像已經加載並且事件不會被觸發。
當窗口負載，而不是當文檔準備好你應該執行你的函數：

$(window).load(function(){ 
    $('#bg').load(function() { 
     $(this).fadeIn('slow'); 
    }); 
});

2011-09-02 13:20:19

我使用.load函數，現在它似乎工作正常。 – alexandru

當DOM準備就緒時，會觸發$(document).ready()事件，但在保證所有圖像都已加載之前。

因此，您遇到的情況可能是，有時您的圖像在.ready事件觸發時尚未加載。

嘗試使用.load事件代替。

2011-09-02 13:19:00

。就緒（）的整點是你的代碼將觸發一次「的DOM分層已全部構建」。既然你在等待一個圖像，這就是你不想要的東西。 jQuery.load（）「不會被觸發，直到所有資產（如圖像）都被完全接收」，因此請將.load語句移出doc。

2011-09-02 13:23:11

回答