使用带有jQuery的CollagePlus网格显示加载gif

Question

我使用CollagePlus创建了一个图片网格，使用非常简单：

HTML

<div class="coll">
    <img src="css/images/gal/1.jpg" width="640" height="320"><!--
    --><img src="css/images/gal/2.jpg" width="932" height="146"><!--
    --><img src="css/images/gal/3.jpg" width="640" height="480"><!--
    --><img src="css/images/gal/4.jpg" width="1020" height="510"><!--
    --><img src="css/images/gal/5.jpg" width="640" height="320"><!--
    --><img src="css/images/gal/6.jpg" width="260" height="390"><!--
    --><img src="css/images/gal/7.jpg" width="680" height="380"><!--
    --><img src="css/images/gal/8.jpg" width="620" height="310"><!--
    --><img src="css/images/gal/9.jpg" width="940" height="520">
</div>

JQUERY

$('.coll').collagePlus();

CSS

.coll{
    padding: 5px;
}

.coll img{
    vertical-align: bottom;
    opacity: 0;
}

图像会在加载时显示。问题是，如果用户的连接速度很慢（并且很多人在我的区域中连接不良），他们在加载之前根本不会显示，所以，我怎样才能显示加载的gif图象？

我尝试使用背景图片，或者在伪类之前使用:: after和::但由于图像在加载之前都有opacity: 0，所以无论如何都会隐藏它们的gif。