预加载和javascript Image()对象
首先是Image()对象的使用,直接贴代码
function preloader()
{
heavyImage = new Image();
heavyImage.src = "heavyimagefile.jpg";
}
以下代码预先加载了heavyimgefile.jpg,当在onMouseOver的时候就不会出现等待的情况。 如果想一次预加载很多张图片可以用以下的代码
function preloader()
{
// counter
var i = 0;
// create object
imageObj = new Image();
// set image list
images = new Array();
images[0]="image1.jpg"
images[1]="image2.jpg"
images[2]="image3.jpg"
images[3]="image4.jpg"
// start preloading
for(i=0; i<=3; i++)
{
imageObj.src=images[i];
}
}
然后是很实用的,经常会遇到在图片加载完成之前提示图片加载中,然后图片加载好了再显示图片,这里给出demo
// create an image object
objImage = new Image();
// set what happens once the image has loaded objImage.onLoad=imagesLoaded();
// preload the image file
objImage.src='images/image1n.gif';
// function invoked on image load
function imagesLoaded()
{
document.location.href='index2.html';
}
Please wait, loading images...
应该很好理解的,上面的例子,先创建Image()对象,然后预加载,通过objImage.onload这个来实现图片加载完成之后执行某些方法之类的。
贴出英文原文的出处,有兴趣的话可以自己过去看看,写的很不错 http://www.techrepublic.com/article/preloading-and-the-javascript-image-object/5214317
285370
HI, THERE!I AM MOFEI