目前,我正在使用这个 jquery,它获取 youtube 视频并在元素的背景中播放它们。
我得到了这段代码,可以播放单个 youtube 视频。但是我想制作一个视频列表并随机播放它们......我现在对 Javascript 不太好,所以我真的很感激这方面的一些帮助......
现在我有这个....
我想制作一个视频列表并像随机播放列表一样随机播放..
$(function()
{
var videos = ['xJvt2SDV7ck', 'x6DD1k4BAUg', 'xJvt2SDV7ck'];
var index = Math.floor(Math.random() * videos.length);
var Video_back = new video_background($("#bgvideo"),
{
"position": "absolute", //Stick within the div
"z-index": "-1", //Behind everything
"loop": true, //Loop when it reaches the end
"autoplay": true, //Autoplay at start
"muted": true, //Muted at start
"youtube": "videos[index]", //Youtube video id
"start": 0, //Start with 6 seconds offset (to pass the introduction in this case for example)
"video_ratio": 1.333, // width/height -> If none provided sizing of the video is set to adjust
"fallback_image": "videos/main.jpg", //Fallback image path
});
});
目前它只播放从列表中随机选择的 1 个视频(单循环)。 我想让它在第一个视频结束时转到另一个视频..
我们将不胜感激!感谢您的宝贵时间!
最佳答案
以下答案基于无法确定视频何时结束的事实。长度以毫秒为单位:
$(function()
{
var videos =
[
{ id : 'xJvt2SDV7ck', length : 60000 },
{ id : 'x6DD1k4BAUg', length : 125000 },
{ id : 'xJvt2SDV7ck', length : 166000 }
];
function playNext()
{
var index = Math.floor(Math.random() * videos.length);
alert( "Playing next movie => " + videos[index].id );
var Video_back = new video_background($("#bgvideo"),
{
"position": "absolute", //Stick within the div
"z-index": "-1", //Behind everything
"loop": true, //Loop when it reaches the end
"autoplay": true, //Autoplay at start
"muted": true, //Muted at start
"youtube": videos[index].id, //Youtube video id
"start": 0, //Start with 6 seconds offset (to pass the introduction in this case for example)
"video_ratio": 1.333, // width/height -> If none provided sizing of the video is set to adjust
"fallback_image": "videos/main.jpg", //Fallback image path
});
setTimeout(function()
{
playNext();
}, videos[index].length);
}
playNext();
});
关于javascript - 在元素的背景上随机播放 youtube 视频,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26314661/