返回顶部

收藏

使用jquery预加载图片

更多

预加载图片可以给用户更好的体验。在不预加载的情况下一张图片往往会一点一点显示,或者先模糊显示,然后才清晰的显示。

使用jquery预加载图片很简单,如下代码:

function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
        $('<img/>')[0].src = this;
        // Alternatively you could use:
        // (new Image()).src = this;
    });
}

// 用法

preload([
    'img/imageName.jpg',
    'img/anotherOne.jpg',
    'img/blahblahblah.jpg'
]);

也可以写成一个jquery插件,以方便使用:

$.fn.preload = function() {
    this.each(function(){
        $('<img/>')[0].src = this;
    });
}

用法:

$(['img1.jpg','img2.jpg','img3.jpg']).preload();

标签:javascript,jquery

收藏

0人收藏

支持

0

反对

0

发表评论