Hide Div, wenn YouTube Video endet

Question

Ich habe eine absolut platziert div mit einem eingebetteten YouTube-Video drin. Ich platziere es über ein anderes Bild auf meiner Website mit der Absicht, Erstbesuchern ein kurzes Video zu zeigen und dann das Div mit dem Video zu verstecken, um den ursprünglichen Inhalt der Seite zu enthüllen.

Ich weiß, wie zu verbergen und meine div mit Click-Events, aber ich bin sehr neu in Javascript. Ich brauche Hilfe beim Schreiben der Funktion, die bestimmen würde, dass das YouTube-Video beendet ist und Sichtbarkeit anwenden: versteckt für mein div. Jede Hilfe wird sehr geschätzt!

Answer 1

sollten Sie einen Blick auf die documentation werfen und dabei besonders auf die Ereignisse achten. Dieses Ereignis wird ausgelöst, wenn sich der Status des Spielers ändert:

werden Sie

OnStateChange werden. Mögliche Werte sind nicht gestartet (-1), beendet (0), Abspielen (1), Pause (2), Pufferung (3), Video-Cued (5). Wenn die SWF zum ersten Mal geladen wird, sendet sie ein nicht gestartetes (-1) Ereignis. Wenn das Video angestrahlt wird und bereit ist, abzuspielen, wird ein Video-CUED-Ereignis gesendet (5).

und Sie wollen, etwas zu tun, wenn der Zustand gleich 0, was ended bedeutet, etwas Ähnliches wie die folgende Liste:

// 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(); 
     } 
    } 

, wenn Sie mit addEventListener Probleme haben, überprüfen YouTube player api - addEventListener() does not work for me?

addEventListener sieht so aus, als ob es nicht von früheren Versionen von IE unterstützt wird und könnte leicht fehlerhaft sein