您的位置:首页 > 其它

图片预加载

2016-01-12 16:36 363 查看

直接添加代码

function ImagePreloader(images, call-back)

{

// 保存回调函数

this.call-back = call-back;

// 状态初始化.

this.nLoaded = 0;

this.nProcessed = 0;

this.aImages = new Array;

// 记录图片的数量.

this.nImages = images.length;

// 对每个图片都调用preload函数

for ( var i = 0; i < images.length; i++ )

this.preload(images[i]);

}

回调函数被保存到以后使用,每个图片的URL被传递到
preload()
里。

ImagePreloader.prototype.preload = function(image)

{

// 生成新的`Image`对象然后添加到数组中

var oImage = new Image;

this.aImages.push(oImage);

//添加事件处理

oImage.onload = ImagePreloader.prototype.onload;

oImage.onerror = ImagePreloader.prototype.onerror;

oImage.onabort = ImagePreloader.prototype.onabort;

oImage.oImagePreloader = this;

oImage.bLoaded = false;

oImage.src = image;

}

oImage.oImagePreloader = this;
可以将回调函数保存在Image对象中;
oImage.bLoaded = false;
可用来标记图片加载成功还是失败。

图片的src属性要最后赋给,这样才可以使用onload进行判断。

ImagePreloader.prototype.onComplete = function()

{
this.nProcessed++;
if ( this.nProcessed == this.nImages )

{

this.call-back(this.aImages, this.nLoaded);

}

}

ImagePreloader.prototype.onload = function()

{

this.bLoaded = true;

this.oImagePreloader.nLoaded++;

this.oImagePreloader.onComplete();

}

ImagePreloader.prototype.onerror = function()

{

this.bError = true;

this.oImagePreloader.onComplete();

}

ImagePreloader.prototype.onabort = function()

{
this.bAbort = true;

this.oImagePreloader.onComplete();
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: