加载随机全屏视频背景(包括jsfiddle)

时间:2016-03-11 01:46:17

标签: javascript css html5 video random

尝试让我的网站显示我将维护的视频文件夹中的随机全屏背景视频。我想继续添加到文件夹(bg1.mp4,bg2.mp4等等)并让代码在加载页面时自动选择随机视频循环。

这是我当前的代码:https://jsfiddle.net/nenr3kyn/2/,它不是完全正常的。我选择了一个特定视频作为源文件:

<source src="http://thenewcode.com/assets/videos/polina.mp4" type="video/mp4">

因为我似乎无法通过javascript&#34; vid&#34;来调用html来设置变量,如下所示:

<source src=vid type="video/mp4">

此外,此代码不允许我只是将文件添加到文件夹,并限制我使用代码中专门列出的视频。我宁愿让javascript能够统计当前文件夹中的所有文件,并选择一个随机的,但也无法使其工作。

有什么想法吗? 任何输入都非常感谢。 非常感谢!!

1 个答案:

答案 0 :(得分:0)

不要使用它不会触发loop事件的ended属性。

videoPlayer.addEventListener('ended', function(){
       var videoLink = ['link1', 'link2','link3'];
       var nextVid = Math.floor( Math.random() * videoLink.length);
       this.src = videoLink[nextVideo];
       this.play();
    });

希望这会有所帮助