Javascript 如何使用jQuery显示图像的加载栏？

我的页面上有图像

我想在我的页面上显示一个加载栏，显示下载图像的进度

我如何才能做到这一点？

我已经编写了一个注册回调以加载图像的程序

你会像这样使用它

var loading = $('<div id="loading" />').appendTo('body');

$('body').waitForImages(function() {
   loading.remove();
 }, function(loaded, all) {
   loading.html(((loaded / all) * 100) + '% loaded');
});

var-load=$（''）.appendTo（'body'）；
$（'body'）.waitForImages（函数（）{
加载。删除（）；
}，函数（已加载，全部）{
html（（（已加载/全部）*100）+'%loaded'）；
});

---

.

更具体一点。加载条的目的是什么？@yckart不推荐使用

load（）

方法。如果事件本身被弃用，它将来自W3C。

var preload = function (images, callback) {
    var count = 0;
    for (var i = 0, len = images.length; i < len; i++) {
        var img = new Image();
        img.src = images[i];
        img.onload = function () {
            var perc = ++count * (100 / len) | 0;
            if (callback) callback.call(this, perc, perc === 100);
        };
    }
};

preload(['http://lorempixel.com/800/600'], function(perc, done) {
    console.log( perc);
    if(done) console.log( 'Done!' );
    // `this` refers to each loaded image.
});