jquery - jPlayer 多视频演示代码？

Question

我只是在学习jPlayer。喜欢它的多功能性，为它运行的每个系统选择合适的格式。是否有任何我应该注意的来自 HappyWorm 或第三方的多视频演示代码？

我想为这样的多个视频创建一个播放器：

PS如果你想在一个最大化的问题上帮助我iframe，请在这里这样做：jPlayer fullscreen while inside IFRAME？

Answer 1

listItem += "<a href='javascript:;' class='" + this.options.playlistOptions.itemClass + "' tabindex='1'><img src='" + media.thumb + " ' />" + media.title +  (media.artist ? " <br /><span class='jp-artist'>by " + media.artist + "</span>" : "") + "</a>";

added a new parameter 'thumb' in de html file ...

Answer 2

首先，到 jplayer.org 下载页面，获取 2.1 的源文件。从源包中获取未压缩的 jplayer.playlist.js 文件。您将需要查看第 243 行以查找吐出播放列表 HTML 的位。您可以使用 poster 参数将缩略图添加到播放列表 HTML 中。像这样的东西（未经测试的代码）：

// add the image
listItem += "<a href='javascript:;' class='" + this.options.playlistOptions.itemClass + "-thumb' tabindex='1'><img src='" + media.poster + "' /></a>";
// existing code to make the title
listItem += "<a href='javascript:;' class='" + this.options.playlistOptions.itemClass + "' tabindex='1'>" + media.title + (media.artist ? " <span class='jp-artist'>by " + media.artist + "</span>" : "") + "</a>";

接下来，您需要从一个主题 CSS 文件开始，作为与视频相关的一些基本要素的参考，然后从头开始重做其余部分，以构建与您的设计相匹配的播放器。

还可以查看 setPlaylist 演示以及您现在可以使用播放列表执行的所有其他很酷的事情：

http://jplayer.org/latest/demo-02-jPlayerPlaylist/

我发现这种加载/更改播放列表的方法非常棒。