Question

我正在使用<embed>标签从服务器读取视频流，我需要在播放此视频之前设置海报图片，但我不知道如何在{{{ 1}}。

这是我的代码：

<embed>

Answer 1

embed元素没有海报属性。视频确实如此，但看起来你正在做视频不支持的事情（假设无论如何）。在这种情况下，您可能需要在顶部使用img元素，在视频开始播放时使用JS删除。

Answer 2

我快速地为你鞭打了这个。应该完成工作。

<style>
    embed {
        display:none;
    }
    #myPosterImage {
        width:100%;
        height:100%;
    }
    #vidWrapper {
        width:400px;
        height:300px;
    }
</style>

<div id="vidWrapper">
    <img src="poster.jpg" id="myPosterImage"/>
    <embed type="application/x-vlc-plugin"
         name="video1"
         autoplay="no" loop="yes" width="400" height="300"
         target="http://10.1.0.1:8180/stream?ip=225.1.0.2&port=1234" /> 
</div>


/* import jQuery at top in <head> and at bottom of page have this: */
<script>
    $(function() {
        $('#myPosterImage').on('click', function() {
            $('#myPosterImage').hide();
            $('embed').show();
        });
    });
</script>

Answer 3

这并不完全回答这个问题，但我建议http://code.google.com/p/fbvlc/wiki/FBVLC_API它是vlc插件的一个分支，可以在IE和其他浏览器中运行，因为vlc需要不同的嵌入标签。

它还有更多有用的javascript事件

在嵌入标签中的海报图像

3 个答案: