预加载其实和延迟加载差不多，一样是使用一个自定义的html属性保存好正确的大图地址，然后当鼠标点击后将正确的大图地址替换给弹出的显示元素上。
html部分：
//这是弹窗显示部分
<div class="">
<div id="photo_masked"></div>
<div id="photo_big">
<i class="photo_off"><span class="off">+</span></i>
<h2 id="photo_title">预加载图片</h2>
<div class="big">
<img src="images/loading.gif" alt="" class=""/>
</div>
</div>
</div>
这是html图片部分，大图自定义属性为bsrc
<img xsrc="images/p1.jpg" bsrc="images/p1_big.jpg" src="images/ph_login1.jpg" alt="" class="wait_load" />
弹窗部分，显示的img元素默认加载的是loading.gif过渡动画的一个动态图，很小。
css部分就不做多的介绍了，都没啥难点，会写都ok
然后js部分！
设置原理：
当图片被点击后，弹窗，先显示gif图片过渡，这时会有一个新建的img元素，这个元素用来加载大图，加载完毕后再将大图的地址给到弹窗里的img元素，这时再加一个透明度过渡的动画，以上就完成了。
那么，如何判断图片是否加载完毕呢?
创建的图片元素会有两个事件，一个是onload事件，一个是onerror事件，顾名思义，第一个是判断加载是否完成，第二个是加载失败，这样就好办了，我们只需要用事件判断一下即可。
但是由于ie浏览器的问题，判断加载的事件必须要在图片加载之前，于是这样写
//图片预加载
var photo = $('#photo_big');
var photo_masked = $('#photo_masked');
$('#photo dl dt img').click(function(){
photo.css('clip','auto').css('opacity','1').center().resize(function(){
if(photo.css('opacity') == '1'){
photo_masked.Masked();
};
});
photo_masked.css('display','block').Masked().animation({
'attr' : 'o',
'end' : 30,
'step' : 7
});
//大图片加载
//先创建一个元素用于保存大图
var temp_img = new Image();
//当大图加载完毕后
$(temp_img).bind('load',function(){
$('#photo_big .big img').attr('src',temp_img.src).css('top',0).css('width','100%').css('height','100%').opacity(0).animation({
'attr' : 'o',
'end' : 100
});
});
//让创建的图片元素加载大图，但是因为ie的问题，图片的onload事件必须在加载代码的前面，所以load事件在加载之前
temp_img.src = $(this).attr('bsrc');
});
$('#photo_big .photo_off').click(function(){
photo.css('clip','rect(0 0 0 0)').css('opacity','0');
photo_masked.animation({
'attr' : 'o',
'end' : 0,
'step' : 7,
'fn' : function(){
photo_masked.removeMasked();
}
});
//关闭后初始化大图图片
$('#photo_big .big img').attr('src','images/loading.gif').css('top','224px').css('width','32px').css('height','32px');
});
使用new Image()的方法创建一个图片元素，这个元素用于缓存之用，当图片加载完毕后，将大图的图片地址替换掉弹出的img图片地址，并且加上透明度的动画过渡，css的设置这个看个人css怎么写再怎么修改，然后加载部分就已经完成了。
初始化部分
当大图显示后，此时弹窗的img图片地址就是你点击的图片大图地址，但是当你换另外一张是，这时过渡会从上一张过渡到这一张，这样是不对的，有残留，这个时候我们需要再次把弹窗的img图片元素的src地址更换为gif图片地址，那么我们再off元素事件中加上初始化即可，上面代码部分已经写出来了。
预览图：
