顯示臨時圖像，直到圖像加載

Question

我想在HTML頁面中顯示臨時圖像，直到加載原始圖像。我怎樣才能做到這一點？

<!-- IMG --> 
<img src="original.jpg" temporary-img="temp.jpg"/> <!-- i have no idea how to do that ! --> 

Answer 1

如果原始圖像仍然加載你可以在HTML中的以下內容：

<img src="temp.jpg" id="img" data-original-img="original.jpg"/> 

如果DOM被加載後，您可以使用圖像，例如。交易所如下：

$(function() { 
    $('#img').attr('src', $('#img').attr('data-original-img')); 
}); 

或者有計劃JS：http://www.w3schools.com/jsref/event_onload.asp

Answer 2

您可以使用CSS添加背景圖像。

img { 
    background: url('temp_image.png') no-repeat; 
}