これが YouTube API の初めての使用であり、ドキュメントを理解するのが難しいと感じています。基本的に、ページには複数のビデオがあります。1 つをクリックすると、ライトボックスにポップアップ表示され、正しいビデオが再生されます。これはすべて正常に機能します。
クライアントは、開始時にすべてのビデオを自動的にミュートすることを望んでおり、ビデオが終了したら、フレームを適切な場所にスキップすることを望んでいます。
YouTube iframe api を使用すると、videoId をまったく更新できないようです。以下は私のコードです:
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
height: '323',
width: '576',
videoId: 'Fy7Li0dMRSY',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
event.target.mute(); // this does not do anything
event.target.playVideo();
}
var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
//setTimeout(stopVideo, 6000);
done = true;
}
}
function stopVideo() {
player.stopVideo();
}
function loadVid(vidID, title){
// loads youtube video with video title & youtube video ID
$('.lightbox .title').html(title);
$('.lightbox iframe').prop('src','https://www.youtube.com/embed/'+vidID+'?rel=0&wmode=transparent&enablejsapi=1');
//player.mute() does not work here
showLightbox();
}
私の問題は、プレーヤー関数を呼び出して loadVid 関数内でミュートしようとすると、エラーがスローされ (どの関数でも同じエラーがスローされます)、プレーヤーなどの関数の使用方法がわかりません。
エラーは player.stopVideo は関数ではありません
では、開始時にビデオをミュートするにはどうすればよいですか? onPlayerReady に追加しても機能しません。