2016-10-17 34 views
0

YouTube動画プレーヤーAPIを使用してYouTube動画をiframeに埋め込みます。再生ボタン、ビデオタイトル、アイコンを右上隅に隠したいこれは、最初に以下に書いたスクリプトで動作しています。しかし、映像が終了したら、ビデオは次のようになります。アイコンやタイトルのYouTube Player API再生ボタン、アイコン、&iframeの動画タイトルを非表示にする

Screenshot of YouTube player API error

なしのいずれかクリック可能です。動画が終了したら、これらの動画はなぜ表示されますか?動画の終了時に右上にビデオタイトル、再生ボタン、アイコンを非表示にするにはスクリプトを編集するにはどうすればよいですか?

// download api code 
var tag = document.createElement('script'); 
tag.src = "http://www.youtube.com/player_api"; 
var firstScriptTag = document.getElementsByTagName('script')[0]; 
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

// this function creates an <iframe> and youtube player after the api code downloads 
var player; 

function onYouTubePlayerAPIReady() { 
    player = new YT.Player('player', { 
    height: '400', 
    width: '800', 
    playerVars: { 
     'autoplay': 1, 
     'controls': 0, 
     'autohide': 1, 
     'wmode': 'opaque', 
     'rel': 0, 
     'loop': 1 
    }, 
    videoId: 'vlRxmgXPcW0', 
    events: { 
     'onReady': onPlayerReady 
    } 
}); 
} 

// the api will call this function when the video player is ready 
function onPlayerReady(event) { 
event.target.mute(); 
} 

答えて

2

ので、コンストラクタのパラメータに'showinfo' : 0,を追加します:ここで

は、これまでの私のスクリプトである限り再生ボタンなど

function onYouTubePlayerAPIReady() { 
    player = new YT.Player('player', { 
    height: '400', 
    width: '800', 
    playerVars: { 
     'autoplay': 1, 
     'controls': 0, 
     'autohide': 1, 
     'showinfo' : 0, // <- This part here 
     'wmode': 'opaque', 
     'rel': 0, 
     'loop': 1 
    }, 
    videoId: 'vlRxmgXPcW0', 
    events: { 
     'onReady': onPlayerReady 
    } 
}); 

、私はあなたを信じていませんそれを隠すことが許可されている - YouTubeのAPIのブランドの利用規約の一部として。

+0

ありがとうございました!再生ボタンを維持する必要がある場合、ホバー上で動作させる方法はありますか?現在、ボタンをクリックすることはできません。ビデオ機能はhttp://pianopushplay.splashworldwide.com/ – Liz

+0

の下に表示されます。その特定のケースでは、 '.video-foreground'に' pointer-events:none; 'があります。 )と '

'は(.video-background'クラスのため)ビデオを隠蔽しているので、ビデオ - あなたは '.video-background'をクリックしています – Pat

関連する問題