图片预加载

直接添加代码

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();
}
posted @ 2016-01-12 16:36  Json_cheeTsui  阅读(219)  评论(0)    收藏  举报