Question

我的网站主页上有一个嵌入式Vimeo视频，设置为在网站加载时自动播放。我也在使用api和froogaloop.js进行一些自定义控件。

我需要做的是保存视频导航到另一个页面时的时间，然后在他们返回主页时从这一点继续播放。

我知道我可以使用playProgress来获取时间，但是当访问者返回主页时，我不知道如何存储以及如何使用它。

修改

我现在有以下代码，并使用js-cookie来存储进度cookie。我如何获得playProgress的值并使用beforeunload上的window将其设置为Cookie？我在javascript上不是很好，所以帮助会很棒！

JAVASCRIPT（也包括此库https://github.com/js-cookie/js-cookie）

$(function() {
    var iframe = $('#player1')[0];
    var player1 = $f(iframe);
    var status1 = $('.status1');

// When the player is ready, add listener for playProgress
    player1.addEvent('ready', function() {
        status1.text('ready');
        player1.addEvent('playProgress', onPlayProgress);
    });

    function onPlayProgress(data, id) {
        status1.text(data.seconds + ' seconds played');
    };

    // SETTING A COOKIE
    Cookies.set('timeElapsed','something');
});

HTML

<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<div class="videoholder">
    <h3>Player 1</h3>
    <iframe id="player1" src="https://player.vimeo.com/video/142216434?api=1&player_id=player1" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    <div>
        <p><span class="status1">&hellip;</span></p>
    </div>
</div>

Answer 1

您只需阅读使用

保存的Cookie的值即可

function onPlayProgress(data, id) {
     Cookies.set('timeElapsed', data.seconds);
     status1.text(Cookies.get('timeElapsed') + ' seconds played');
}

然后通过在网址末尾添加&t=0m0s来设置视频加载时的值。

$('#player1').attr('src','https://player.vimeo.com/video/142216434?api=1&player_id=player1&t='+timeElapsed)

Answer 2

我使用以下javascript工作：

$(function() {
var iframe = $('#player1')[0];
var player1 = $f(iframe);

// When the player is ready, add listener for playProgress
player1.addEvent('ready', function() {

    player1.api('seekTo',(Cookies.get('timeElapsed')));

    player1.api('pause');

    player1.addEvent('playProgress', onPlayProgress);
});

function onPlayProgress(data, id) {

  Cookies.set('timeElapsed', data.seconds);

};

});

我现在唯一的问题是，当您返回（暂停）视频时，您需要点击两次以使其恢复，因为“暂停”按钮可见。有谁知道为什么会这样？这是我的Vimeo拼图的最后一块！

从上次进度中恢复Vimeo视频

2 个答案: