Question

我在我的网站和移动设备上有一个brightcove视频集成我想隐藏视频，然后当用户点击链接时，它应该打开视频并开始播放。

HTML

<div id="video_player"><!-- brightcove player goes here --></div>
<script>
    BCL.addPlayer('video_player', '2327273222001');<!-- 'id' of target div, Brightcove Asset ID -->
</script>
<a class="test" onClick="" href="#">Test</a>

http://machinas.com/wip/hugoboss/brightcove/

有一种简单的方法吗？

Answer 1

使用CSS隐藏视频播放器，然后在单击test锚点时，显示视频播放器并初始化它（如果尚未显示）。

假设addPlayer是同步的，您可以立即调用play方法。如果它不是同步的，那么你需要将一个回调函数传递给调用play方法的addPlayer。

<强> CSS

#video_player {
    display: none;
}

jQuery

$('a.test').on('click', function(e) {
    var vidPlayer = $('#video_player');

    if(!vidPlayer.is(':visible')) {
        vidPlayer.show();
        BCL.addPlayer('video_player', '2327273222001');<!-- 'id' of target div, Brightcove Asset ID -->   
        brightcove.play(); //assumes your Brightcove variable is named brightcove
    }
    e.preventDefault();
});

Answer 2

您不应使用display:none;来隐藏您的视频，根据Brightcove文档，您应该使用left:-9999px;或除隐藏之外的任何其他方法。

除非用户先点击播放按钮，否则您无法使用JS播放视频。然后，您可以实际播放，暂停和更改视频。

隐藏brightcove视频并启动on <a> link</a>

2 个答案: