YouTubeビデオが終了したときにDivを表示しない

Question

私は埋め込まれたYouTubeビデオが入ったdivが絶対配置されています。最初の訪問者に短いビデオを見せてから、そのビデオのdivを隠してページの元の内容を明らかにするという目的で、私は自分のウェブサイト上の別のイメージに置きます。

私はクリックイベントで私のdivを表示して表示する方法を知っていますが、私はJavascriptにとって非常に新しいです。私は、YouTubeのビデオが終了し、可視性を適用するかどうかを判断する関数を書くのに役立つ必要があります。私のdivに隠されています。どんな助けでも大歓迎です！

Answer 1

あなたは、イベントセクションに特に注意して、documentationを注意深く見たいと思うでしょう。

あなたは

にOnStateChangeを使用します： このイベントは、いつでも、プレイヤーの状態の変化を解雇されます。可能な値は、非開始（-1）、終了（0）、再生（1）、一時停止（2）、 バッファリング（3）、ビデオキュー（5）です。 SWFが最初にロードされると、 は起動していない（-1）イベントをブロードキャストします。ビデオがキューされ、 の再生準備が整うと、ビデオキューイベント（5）がブロードキャストされます。

、あなたは以下のようなもの、エンドを意味し、状態が0に等しいときに何かをしたいと思うでしょう：あなたがにaddEventListenerに問題がある場合は、YouTube player api - addEventListener() does not work for me?

をチェックアウト

// attach your listener 
    function onYouTubePlayerReady(playerId) { 
     var ytplayer = getElementById("myytplayer"); 
     ytplayer.addEventListener("onStateChange", "onytplayerStateChange"); 
    } 
// your callback function 
    function onytplayerStateChange(newState) { 
     if (newState === 0){ 
      $('yourContainingDiv').hide(); 
      // or if you want to just remove it... 
      $('yourContainingDiv').remove(); 
     } 
    } 

addEventListenerは、IEの初期バージョンではサポートされていないため、わずかにバグがある可能性があります。