0
我用YouTube API寫了this stupid toy。基本上它只是在不同的隨機時間開始多個視頻副本。這對一年來很好。但是今天我注意到隨機開始時間不再起作用,它只是在t = 0時開始所有的視頻(在多個瀏覽器/操作系統/計算機上測試過)。使用YouTube API設置視頻開始時間 - 「開始」playerVars選項用於工作,但現在不?
任何想法有什麼不對?我只是將一個隨機數傳遞給start
參數。看起來很簡單。
這是我的代碼。關鍵部分在add
函數中,其中start
參數設置爲playerVars
。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Flockas</title>
</head>
<body>
<button id="pause">Pause Flockas</button>
<button id="add">Add One Flocka</button>
<button id="remove">Remove One Flocka</button>
<p>
<div id="flockas"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
var flockas = [];
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
function onPlayerReady(event) {
event.target.playVideo();
}
function add() {
var start = Math.random() * 60;
$("#flockas").append('<div id="flocka' + flockas.length + '" class="flocka"></div>');
flockas.push(new YT.Player('flocka' + flockas.length, {
height: '105',
width: '140',
videoId: 'yOc-MXGuKgs',
playerVars: {
autoplay: 1,
loop: 1,
playlist: 'yOc-MXGuKgs',
start: start
},
events: {
'onReady': onPlayerReady
}
}));
}
function remove() {
var divs = $(".flocka");
$(divs[divs.length - 1]).remove();
flockas.splice(flockas.length - 1)
}
function pause() {
var pauseEl = $("#pause");
if (pauseEl.html() === "Pause Flockas") {
for (var i = 0; i < flockas.length; i++) {
flockas[i].pauseVideo();
}
pauseEl.html("Play Flockas");
} else {
for (var i = 0; i < flockas.length; i++) {
flockas[i].playVideo();
}
pauseEl.html("Pause Flockas");
}
}
function onYouTubeIframeAPIReady() {
for (var i = 0; i < 5; i++) {
add();
}
}
$("#add").click(add);
$("#remove").click(remove);
$("#pause").click(pause);
</script>
</body>
</html>
就像我上面說過的,當我最初做到這一點時,它工作得很好,而且我最近才注意到它不起作用。