js / jquery：如何同步加载和显示图像序列？

Question

我在jpeg图像序列中有一些视频：

  

part1.jpg，part2.jpg，part3.jpg，（...）part500.jpg

我想把它们当成一个亮片。我想我需要一些同步事件：如果未加载和显示image1，则不显示image2。

播放JPEG图像序列的最佳做法是什么？ （jquery或js解决方案）

（假设它是20 fps序列）

Answer 1

如果我理解你想将它们显示为一个序列，但只有在加载了所有图像之后？您无法创建同步事件，例如在未加载图像时暂停脚本，但您可以使用异步事件，例如：

var imagesToLoad= 500; // 500 images to load

$('img').on('load', function() {
    imagesToLoad--;

    if(!imagesToLoad) { // all images were loaded
        // run your carousel here
    }
});

只有在加载完所有图像后，轮播才会开始。