javascript - 平板电脑以高分辨率缓慢构建画廊图像

Question

我只有 html 应用程序，并且我在图库图像中显示高分辨率图像（超过 1000 像素 x 1000 像素）并且需要很长时间才能加载所有内容（超过 40 多张图像），它们位于我自己的图像文件夹应用程序中，也就是说，图像按图像加载非常缓慢。有什么方法可以在之前显示某些内容并将所有内容加载到背景中，然后在完成时显示图库图像？比如，在一切都开始加载这些高分辨率图像时显示启动画面，当它完成时，它会显示我的画廊图像。
编辑：画廊需要很长时间才能加载开始构建的图像。编辑2：标题

Answer 1

我用我经常使用的图像预加载脚本创建了一个 JSFiddle。在示例中，我从 Flickr 加载一些大图像，一旦加载，旋转的 gif 将替换为加载的文本。

** 注意：这确实使用了 jQuery 的 load() 函数，但可以很容易地转换为原生 JS。

var preLoadImages = function (files, callback) {
    var i, img, _count, _counter, _interval;
    _count = files.length;
    _counter = 0;
    i = 0;
    while (i < files.length) {
        img = new Image();
        img.src = files[i];
        $(img).load(function () {
            return _counter++;
        });
        i++;
    }
    return _interval = setInterval(function () {
        if (_count === _counter) {
            clearInterval(_interval);
            return callback();
        }
    }, 50);
}

希望这将帮助您实现目标。

http://jsfiddle.net/CcVqs/