HTML5视频循环淡入淡出

我正在制作一个有视频背景的网站。目前，我有一个背景循环，随着用户的移动，但当视频结束时，它只是再次跳到开始。我想不出如何让它在视频开始前的一两秒钟淡出。我在其他网站上看到过，例如：

这是我目前的代码：

<video id="video_background" preload="auto" autoplay="true" loop="loop"> <source src="assets/video/street1.mp4" type="video/mp4">

---

任何帮助都将不胜感激

一种方法是编辑视频本身

剪切视频的最后5秒，并将其粘贴到开头。然后给过渡一种淡入淡出的效果

有很多软件可以帮助你做到这一点