html - 将视频位置与系统时间同步

Question

我刚开始使用 html5 & co。（不是一个该死的初学者，但已经有一段时间了..）我需要一些建议来创建我的项目。

设置：我有一个 24 小时视频，应该在 html 网站上全屏显示（仅限离线使用）。如果您打开 html 文件，视频应自动从相应的视频位置开始 - 与系统时间同步（例如：视频时间轴中的 1.30am = 1.30h）。

一个在线示例可能是 24hoursofhappy 网站，如果您打开它，视频将从同步的系统时间位置开始。

你们能帮帮我吗？我不知道如何实现这一点：/

Answer 1

您可以设置该currentTime属性以跳转到视频中您想要的部分：

返回当前播放位置，以秒为单位。

可以设置，寻找到给定的时间。

例如，此视频将在 30 秒后开始：

var v = document.getElementById("myvideo");
v.currentTime = 30;
v.play();

<video id="myvideo" src="http://media.w3.org/2010/05/sintel/trailer.mp4" width="320" controls loop></video>

在您的情况下，您将拥有一个 24 小时视频，因此您需要根据一天中的时间计算位置（并记住currentTime以秒为单位）。无论如何，这应该很容易；这样的事情应该做：

var d = new Date();
var v = document.getElementById("myvideo");
v.currentTime = d.getHours() * 3600 + d.getMinutes() * 60 + d.getSeconds();
v.play();