javascript - 同じビデオを繰り返さずに、ロード時にランダムな背景ビデオをロードします

Question

私はかなり長い間、このホームページの背景ビデオに取り組んできましたが、より良いものにするために常に手を加えようとしています。

テストを行ったところ、12 本の動画をそれぞれ少なくとも 1 回読み込むのに 37 回のページ更新が必要でした。最終的にすべてのビデオを少なくとも 1 回見たところで停止しましたが、それは約 5 回見たことを意味します。

Squarespace を使用しましたが、これはカスタム HTML ホームページです。 http://www.rupertlaycock.com

window.onload = function(){
var videoList = [
"a",
"b",
"c",
"d",
"e",
"f",
"g",
"h",
"i",
"j",
"k",
"l"
];
$("#splash-vid").html("<video id='bgvid' autoplay muted id='bgvid' loop><source src='s/" + videoList[Math.floor(Math.random() * videoList.length)]  + ".mp4' type='video/mp4'>")

さらに、同じビデオを同じフォルダー、つまり「a.mp4」と「a.webm」にアップロードしているため、Chromeの拡張子を.webmに変更するコードを次に示します。また、src ファイル名の場合のように、type='video/mp4' タグの type='video/webm' への変更を自動化する方法がわかりません。

if (window.chrome)
$("[type=video\\\/mp4]").each(function()
{
    $(this).attr("src", $(this).attr("src").replace(".mp4", ".webm"));
    $(this).attr("src", $(this).attr("src").replace("/mp4", "/webm"));
});}

誰かがこれについて改善した場合、私はめちゃくちゃ感謝しています!