Vimeo API-自动加载多个视频而没有可见的过渡

时间:2019-07-02 15:27:30

标签: vimeo-api vimeo-player

希望具有视频背景。该视频背景将从vimeo视频列表中随机播放。我一切正常,但是在下一个视频加载时有可见的闪光/颜色。有什么技巧可以解决这个问题吗?

<div class="welcome-section">
    <div class="vimeo-wrapper">
        <?php
        $vimeo_list = get_field('vimeo_videos');
        $vimeo_list_array = explode(',',$vimeo_list);
        $vimeo_rand = array_rand($vimeo_list_array);
        $poster_img = get_field('video_thumbnail');
        $video_url = get_field('video_bg');
        ?>
        <?php   
        $video_play = "https://player.vimeo.com/video/". $vimeo_list_array[$vimeo_rand] ."?autoplay=1&background=1&byline=0&title=0&loop=0";
        ?>
        <iframe id="vimeoplayer" src="<?php echo $video_play ?>"
           frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="autoplay; encrypted-media"></iframe>

    </div>

<script src="https://player.vimeo.com/api/player.js"></script>
<script>
    var iframe = document.querySelector('iframe');
    var player = new Vimeo.Player(iframe);
    var vids = <?php echo json_encode($vimeo_list_array); ?>;

    player.on('ended', function() {
        player.getVideoId().then(function(id) {
        // id = the video id
        var currentVid = id;    
        var currVid = vids[Math.floor(Math.random()*(vids.length-1))];
        if(currentVid == currVid)
            {
                var currVid = vids[Math.floor(Math.random()*(vids.length-1))];
            }
        player.loadVideo(currVid).then(function(id) {
        // the video successfully loaded
    });
            });
    });


</script>

0 个答案:

没有答案