<body>
<div id="pic"></div>
<script type="text/javascript">
window.onload=function(){
var pic=document.getElementById("pic");
preLoadImages(['imges/0.jpg','imges/1.jpg','imges/2.jpg','imges/3.jpg']).done(function(images){
for(var i=0;i<images.length;i++){
var img=document.createElement("img");
img.src=images[i].src;
pic.appendChild(img);
}
});
}
function preLoadImages(imgs){
var imgs=(typeof imgs!="object")?[imgs]:imgs;
var newImages=[],loadedImages=0;
for(var i=0;i<imgs.length;i++){
newImages[i]=new Image();
newImages[i].src=imgs[i];
newImages[i].onload=function(){
imageLoadPost("load")
}
newImages[i].onerror=function(){
imageLoadPost("error")
}
}
function imageLoadPost(status){
if(status==="error"){
alert("图片加载失败");
}else{
loadedImages++;
if(loadedImages===imgs.length){
postaction(newImages);
}
}
}
var postaction=function(){
}
return {
done:function(f){
postaction=f||postaction;
}
}
}
</script>
</body>
</html>