如何为图像构建 JavaScript 预加载器

我有一页缩略图，可以使用 jquery 中内置的图像交换脚本悬停来更改其不透明度。但是，当我在实时网站上运行它时，速度很慢，您必须等待第二个图像加载，因此悬停交换不会立即发生。如何在页面加载时预加载所有缩略图？该网站已上线here http://www.scatliff.andcreate.com/portfolio.php

这是html

<div class="span-16 last" id="thumbs">
        <div class="span-4">
            <a href="waterfront.php"><img src="images/thumbs/thumb1.gif" id="thumb1"></a>
        </div>

    </div><!--THUMBS ENDS-->

这是jquery

$("#thumb1").hover(
        function(){
            $("#thumb1").attr("src","images/thumbs/thumb1A.gif");
            },

        function(){
            $("#thumb1").attr("src","images/thumbs/thumb1.gif");

        });

以亚历克斯的回答为基础

var images = ['a.jpg','b.jpg','c.jpg'];
var preload = [];
for(i in images)
{
    preload[i] = new Image();
    preload[i].src = images[i];
}

这会预加载中的所有图像images大批。 当然，该脚本假设您事先知道要预加载哪些图像。