如何动态使用第一帧作为移动HTML5视频中的海报?

问题描述:

我试过了popcorn.capture.js并设置了preload="auto",第一个正好适合firefox和下一个适合pc浏览器。我想通过移动(微信)实现某种方式。你可以帮帮我吗?如何动态使用第一帧作为移动HTML5视频中的海报?

+0

我以为只是忽略'海报'一起给你第一帧作为默认。> [一个URL指示一个海报框架显示,直到用户播放或寻求。如果未指定此属性,则在第一帧可用之前不显示任何内容;那么第一帧显示为海报帧。](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video) – zer00ne

+0

非常感谢。它在PC上的chrome中运行良好,但不适用于手机。另外,它似乎与视频编码有关。我正在探索。 –

在移动设备上,您可能会发现设备不会自动开始下载视频。这是为了避免用户运行大量数据账单。

由于bowser未下载视频,因此无法提取第一帧以显示它,因此您需要使用HTML5中的海报机制将图像显示为缩略图。

一种常见的方法是在您摄取视频或将视频添加到服务器并将其保存在可作为视频海报的位置时,在服务器端生成缩略图。

+0

谢谢,实际上我最终使用了你的建议。 –