如何在HTML5视频中添加交互性

使用HTML5视频，开发者可以做的不仅仅是流媒体内容. 最近在阳光明媚的亨廷顿海滩举行的流媒体西部会议上, 加州, 查克·哈德逊, 的作者之一 HTML5开发者的食谱他领导了一个关于在视频中添加交互性的大师班.

Hudson开始说道:“我们讨论的是如何让HTML5(即视频标签)具有互动性. “视频标签为我们在不同的百家乐软件中嵌入视频等提供了一个很好的手段, 假设你至少玩过一个视频标签, 你至少知道怎么在里面放视频. 但我们要更进一步."

开发者能够创造出什么样的交互性呢? 前途无量. Hudson的演讲讲述了如何制作热点，捕捉用户输入，以及如何在移动设备上工作.

“我们真的想创造一种引人入胜的体验，可以在视频元素之上添加叠加. 它可能在控制视频的时间线. 我们将用它做一些很好的事情，”哈德森说. “使用字幕并利用这些字幕来吸引用户, 特别是当我们在做可本地化的内容时, 流媒体视频遍布全球. 我们将使用Track元标签, 也, 我们将利用这些来实现一些非常有趣的解决方案，在这些解决方案中，我们可以使用JSON对象表示法，并开始利用它来获取视频标签时间轴上更详细的数据和信息."

有关在HTML5 Video中添加交互性的详细帮助，请观看下面的视频和下载Hudson的演讲.

如何:使HTML5视频元素具有互动性

HTML5 Video元素现在已经被浏览器广泛使用，并在许多网站上支持流媒体视频内容. 使用一些JavaScript和CSS, 我们可以利用HTML视频元素在传统和移动浏览环境中为观看者创造高度互动的体验. 这个实践课程探讨了事件与视频时间轴的整合, 创建带有链接和动态内容的定位热点, 获取用户输入. 除了, 会议探讨了支持移动平台浏览器以及HTML5视频标签的未来机会. 获取示例代码, 的想法, 以及让HTML5视频元素为观众提供引人入胜的互动体验的最佳实践.

发言人: 查克·哈德逊合著者, HTML5开发者的食谱