JwPlayer - 播放前显示视频截图

时间:2012-02-29 19:57:58

标签: javascript jwplayer

我无法找到任何相关信息,所以也许有人可以帮我一把

我想要做的是当JwPlayer加载时,而不是它当前显示的默认黑屏,我希望它显示一个来自它设置播放的视频的帧

以下是我用来加载JwPlayer的HTML和JS的片段

<div id="video">
</div>

<script type="text/javascript" language="javascript">
        jwplayer("video").setup({ 
            height: 300,
            width: 620,
        autostart: false,
        volume: 50,
        file: "/video.mp4",
            modes: [
        {
                type: "html5",
                config: {
                    file: "/video.mp4"
                }
            },
        {
                type: "flash",
                src: "/player.swf"
            },
        {
                type: "download"
            }]
        }); 

</script>

请注意,我没有将其设置为自动启动,因此在加载时它只会显示黑屏,并在黑屏上叠加播放按钮

我知道如何让它在设置功能中显示图像而不是带有图像属性的黑色屏幕,但这需要我从视频手动生成图像并将其上传到服务器。我需要它能够根据视频动态地进行操作

我查看了JWPlayer文档但找不到任何内容,所以也许它甚至不可能做到,但希望也许有人知道比我更好

谢谢!

3 个答案:

答案 0 :(得分:2)

看起来snapshot plugin可能正是您要找的。

答案 1 :(得分:0)

我意识到这个问题已得到解答和接受,但是,一个选项是启动播放器并立即暂停。这对我有用:

onReady: function () {
    $this = this;
    this.play(); 
    var pauseMe = window.setTimeout(this.pause, 500); // sets auto poster
    ...
}

这只适用于您想要显示视频的第一帧左右的情况;在视频中的任何其他位置抓取特定帧可能与seekTo()一起使用,然后播放和暂停,但您可能会遇到缓冲延迟。我实际上现在需要从视频中稍后抓取图像,所以可能会尝试或ffmpeg:)

答案 2 :(得分:0)

在设置中只需添加“图像”

jwplayer("myDiv").setup({
  "file": "http://example.com/myVideo.mp4",
  "image": "http://example.com/myImage.png",
  "height": 360,
  "width": 640
});