Javascript 什么'；It’这是一种很好的显示；“正在加载…”；形象？

我使用的是一个

div

，其中包含任意数量的

img

元素。现在，每个

img

都有以下CSS：

#content > img {
display: none;
position: absolute;
top: 0px;
left: 0px;
}

---

图像可以通过一个功能循环显示，并依次隐藏。然而，在加载每个图像时，我想显示一个“正在加载…”图像。我想使用JavaScript/jQuery将每个不完整图像的源代码交换为“正在加载…”图像，同时仍然允许加载。什么是精干而吝啬的方法呢？

这里有一个imagesLoaded插件：

只需显示加载图像，绑定到

imagesLoaded

事件，并在触发时隐藏加载图像

更新：

实际上，jQuery现在已经内置了检测加载的方法：

$（function（））{
$（'img'）。每个（函数（）{
var original=this.src；
var$this=$（this）；
$this.attr（'src'，'loading.gif'）；//切换到加载图像。
$('
是的，我知道这个插件。我想我可以在每次显示一个图像时执行一个函数。如果它不完整，则会显示“加载”图像（在
div
前面）。否则，它不会显示。我正在考虑切换每个图像的源，但我想没有必要。别忘了我们有
hide
和
show
方法。我认为src方法不起作用，因为你需要将它设置为大图像才能开始下载。@Matt-我不太明白这一点-
d需要将其设置为大图像才能开始下载
假设您有一个要显示的图像“/test.jpg”。只有将img标记的src设置为“/test.jpg”，浏览器才会开始下载它。因此，如果您想通过src属性进行交换，您需要首先将src属性设置为其他img标记，因此您可以只执行一次。呵呵，我将向您介绍
$（'）。这就像
。唯一的区别是
$（''）
未附加到
DOM
。酷；）现在有一个想法。在
$（“”）
选择器中的
和
的用途是什么？除了选择
img
元素之外，这还起什么作用？
$(function(){
   $('<img>').attr('src','loading.gif'); // preload the "loading" image.

   $('#content > img').each(function(){
       var original = this.src;
       var $this = $(this);
       $this.attr('src','loading.gif'); // swap to loading image.
       $('<img>').attr('src',original)// pre-load original.
              .load(function(){
                 $this.attr('src',original); // swap it back when pre-load is done. 
              });
   })
});