HTML5视频在视频加载前闪烁白色

Question

我有一个video元素，我正在将src动态更改为所选的其他视频。但是，在视频加载之前，背景一直保持白色背景-仅当我激活控件时！

<video id="video" width="1920" height="1080" preload="auto" controls="true" webkit-playsinline>
    <source src="videos/3.mp4" type="video/mp4">
    Your browser does not support the video tag.
</video>

$("#firstButton").click(function () {
  $("video").attr("src", "videos/1.mp4");
  $('.langversion').html('');
  $('.langversion').append('First Text')

  var playButton = document.getElementById("play-pause");

  playButton.innerHTML = "<i class='material-icons'>play_circle_outline</i>";
  active = 1;

  var video = document.getElementById("video");
});

我尝试在视频元素上放置background-color，但无济于事。我还尝试将边框底部添加到video元素，但没有成功。

border-bottom: 1px solid transparent;

老实说，我不知道它来自哪里以及如何预防。