代码之家 › 专栏 › 技术社区 › Adam

CSS+加载时显示动画GIF

css html

Adam · 技术社区 · 12 年前

我想在加载图像时显示一个动画GIF,我想使用CSS来实现这一点。(例如:如果可能,没有JS)。

 <img src="images/users/girl1.png" class="thumbnailPreLoader memberImage"/>


 .thumbnailPreLoader {
     background: url('/images/image-preloader.gif') no-repeat scroll center center #F9F9F9;
     height: 101px;
     width: 101px;
     position: relative;
 }


 div#preferredMembers img.memberImage {
     border: 1px solid #808080;
     padding: 3px;
 }

以上是我目前正在使用的内容,您可以在www.datingjapan.co上看到(一组5张缩略图)。

我现在发现我只是看不到GIF。

如果我进入chrome开发者模式并更改img的路径,我可以看到GIF,这样我就知道路径等是正确的。

这可能吗?我错过了什么把戏吗?任何帮助都将不胜感激。

注意:我知道如何使用jquery.load()来实现这一点,但只附加一个CSS类会更适合我。

thx公司