2012-04-16 65 views
5

是否有一些简单的技术只播放HTML5视频的某个部分?例如,在30秒的片段中,我只想播放5-20秒的部分。此外,视频的其余部分应该无法从UI访问(意味着视频时间线应仅显示5-20秒部分)。HTML5视频 - 只播放视频的一部分

我一直在浏览一些HTML5视频播放器,但他们都没有支持这种功能。如果有人知道一个(好)的方式来实现这个功能,请给我一个提示。

在此先感谢!

+0

我使用VideoJS播放器(http://videojs.com/)做了一些实验,并且至少在桌面,Android设备和iPad上设法使它工作。 – calle 2012-05-25 12:33:45

+0

基本上,我必须重写原始播放器的某些功能才能正确呈现控件,并使用视频的“timeupdate”事件来限制视频的播放时间。我必须同意@Riplikash的观点,即目前实现部分游戏行为的唯一体面的方式是从服务器提供可播放的内容,而不是试图将其限制在客户端。 – calle 2012-05-25 12:43:26

回答

1

即使此问题已被标记为已回答,以下是您可能会感兴趣的内容以及其他在此处发现的其他人:Specifying playback range

它是Media Fragment API的一部分,目前可用于最新版本的Firefox,Chrome和Safari 6+。

+0

这个答案比标记为正确的答案有用。谢谢@Ian Devlin – 2014-07-21 09:19:47

+0

该链接不再有效,在那里没有关于指定播放范围的信息。 – prendio2 2017-10-06 10:26:17

0

您可以在玩家中实现一个Player.Play()事件,每当Play()调用时启动一个计时器并在您想要的特定时间调用Player.stop()。

0

我得到了同样的问题,我没有发现的东西,可以解决这个问题,你可以做的是实现自己的控制和显示用帆布视频......

,如果你是试图在IOS中实现这一点,你将无法做到这一点。

+0

使用JavaScript,您可以播放所需的部分时间,但UI将显示实时,您可以隐藏原始控件,但用户可以通过“右键单击” - >“显示控件“我发现的最接近的方式是使用可以显示JWPlayer的部分时间的播放器,它可以显示”假“持续时间,但即使您可以从其他点开始,开始时间始终为0 ... – 2012-04-16 13:42:38

+0

但是在iOS不工作... – 2012-04-16 13:44:34

0

我的想法是使用自定义控件,因为我不相信本地可用的功能。所有html5控件的功能(播放,暂停,时间戳开始等)都可以通过javascript调用。在这种情况下,您将要编辑currentTime变量。

因此,您可能需要考虑设置您自己的滑块,滑块的起点代表您的起点,并结束您的终点。将视频设置为在页面加载时不播放。然后在页面加载有一个JavaScript函数改变currentTime到你的出发点。为了停止,你偶尔可以查询当前时间。由于缓慢加载等延迟可能会导致延迟,我不会使用计时器。

+0

您无法完全限制用户通过HTML5视频查看视频的其他部分。这有点像标签。它非常开放。您必须限制视频的哪些部分将在服务器端提供。 – Riplikash 2012-04-16 15:39:26

+0

想要一些工作代码片段 – 2014-07-21 08:41:12

0

我试图在“预览模式”中实现一个类似的视频。我通过添加一个事件监听器,然后在currentTime()=='x'postition中暂停视频来利用上述方法。为了防止用户再次点击播放,currentTime监听器不会允许播放超过时间轴中的'x'时间,因此每次用户点击播放时,它都会自动立即再次暂停播放。此外,在时间'x'处,视频容器将通过CSS隐藏,从而防止用户与视频的交互。