具有缩略图的自举模式视频播放器

Question

我在网站上创建了一个视频画廊。用户可以在其中单击照片并打开模态。模态内部有一个视频播放器。这是代码：

amount *= Config.RUNECRAFTING_AMOUNT_MULTIPLIER;

现在我想将视频的缩略图保留在图像的位置。我该怎么做？

Answer 1

您可以为每个视频分别生成缩略图，然后按照上面的图片使用它们，或者将您的图库作为视频库，然后像上面一样使用HTML5视频标签来显示缩略图并在用户启动时显示视频。

要将第一帧显示为带有视频标签的缩略图，只需预加载元数据：

<video controls="controls" preload="metadata">
  <source src="yourVideoPath" type="video/mp4">
</video>