希望具有视频背景。该视频背景将从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>