css - 大图像的图像加载器动画

Question

我在我的网站上的画廊中有一些高分辨率图像，我只想要某种动画，比如可以在ajaxload.info找到的动画，以代替我的图像显示，直到它完全加载。它的一些建议就像在你的css中添加这样的东西一样简单：

img { background:url('../images/ajax-loader.gif') center center no-repeat;}

好吧，这会将这个背景图像添加到我的透明“spacer.gif”中，从而导致加载图像显示在我的垫片所在的位置。然而，这种“方法”甚至一开始都行不通。当我查看高分辨率图像时，它们仍然从上到下加载，我什至看不到 loader.gif。有什么帮助吗？我以为到处都有这方面的信息，但我一生都找不到。

Answer 1

只需给所有高分辨率图像一个类，然后在 css 中使用类名而不是全局 img 标签来设置背景。

如果您使用 jquery 加载图像，则图像不会从上到下加载，而只会在完全加载时出现，因此背景加载器图像将可见，一旦图像完全加载并显示，加载器将是覆盖。这种方法非常有效，因为它非常简单，您可能只是错过了一些东西。