Javascript 带有CSS/JS&；的全屏背景视频；保持纵横比

目前我有一个大约2500个视频的目录，纵横比各不相同。大多数都是1080P，很容易全屏显示，但偶尔的视频是4:3或9:16或其他奇怪的比率。我想做一个全屏背景视频，但要保持纵横比，这样视频就不会被剪辑。如果加载了4:3的视频，代码会全屏显示视频，但会将大部分视频剪辑出来。当然，所有1080P视频都可以正常加载

目前HTML5/PHP/CSS/JS是这样的：

视频{
保证金：0；
填充：0；
}
.视频容器{
位置：绝对位置；
排名：0；
底部：0；
宽度：100%；
身高：100%；
溢出：隐藏；
}
.视频容器视频{
/*制作至少100%宽和高的视频*/
最小宽度：100%；
最小高度：100%；
/*将“宽度和高度”设置为“自动”可防止浏览器拉伸或挤压视频*/
宽度：自动；
高度：自动；
/*将视频居中*/
位置：绝对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
-webkit转换：翻译（-50%，-50%）；
-ms转换：翻译（-50%，-50%）；
}

播放列表
（功能（）{
var video=document.getElementById（“bgvid”）；
video.addEventListener（“canplay”，函数（）{
video.play（）；}）；
video.onended=函数getVideo（）{
location.reload（）；
};})();