显示临时图像，直到加载图像

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'));
});

或使用Plan JS：http://www.w3schools.com/jsref/event_onload.asp

Answer 2

您可以使用CSS添加背景图片。

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