创建视频在线播放_创建一个简单HTML5视频播放列表

创建视频在线播放

Last week two of my students wanted to know if there was a way to create a HTML5 video playlist without using a third-party service such as YouTube. They also wanted a responsive solution that would be easy to implement.

上周，我的两个学生想知道是否有一种无需使用第三方服务(例如YouTube)即可创建HTML5视频播放列表的方法。 他们还想要一种易于实施的响应式解决方案。

One possible answer is to use PHP to generate URL variables for a <video> element, an approach similar to the one I’ve provided in the simple server-side image gallery. There are also many JQuery plugin candidates, but it seemed excessive to load in a 100K framework just to create a playlist. Instead, I opted to show the students a solution using native JavaScript, using the principles of progressive enhancement.

一个可能的答案是使用PHP为<video>元素生成URL变量，这种方法类似于我在简单的服务器端图像库中提供的方法 。 也有很多JQuery插件候选对象，但是将其加载到100K框架中似乎只是为了创建播放列表，似乎过多了。 相反，我选择向学生展示使用本机JavaScript的解决方案，并使用逐步增强的原理。

The easiest way to start development on the video playlist is to work from the base HTML upwards. For this example I’ll reference outtakes from Marsel Van Oosten’s and Daniella Sibbing’s spectacular a