jquery youtube api - когда видео перестает воспроизводиться, я хочу, чтобы оно исчезло

Question

Это мой код jquery:

/* videoplayer controls */
$('#sjvslider li a').bind('click', function() {
$('#sjvslider li a').removeClass('active');
$(this).addClass('active'); // sets the thumbnail that what just clicked.
var vidNum = $(this).attr('rel');
var myVid = $("#video"+vidNum+"").html();
$('.videoplayer').html(myVid);
});

Это мой HTML:

<div id="videoDiv" class="videoplayer"></div>

<div id="video1" >
<object width="508" height="273" id="myytplayer" data="http://www.youtube.com/v/CezWPkoWXbY?version=3&amp;hl=en_US&amp;rel=0&amp;enablejsapi=1&playerapiid=ytplayer">
 <param name="allowscriptaccess" value="always">
 <param name="bgcolor" value="#000">
 </object>
 </div>
 <div id="video2" class="novideo">
 <object width="508" height="273" id="myytplayer" data="http://www.youtube.com/v/qhluM6nrCVs?version=3&amp;enablejsapi=1&playerapiid=ytplayer">
 <param name="allowscriptaccess" value="always">
 <param name="bgcolor" value="#000">
 </object>
 </div>

А потом у меня есть несколько ссылок с некоторыми текстовыми ссылками, чтобы получить правильный videoID.

<ul id="sjvslider">
<li><a href="#" rel="1">VIDEO 1</a></li>
<li><a href="#" rel="2">VIDEO 2</a></li>
</ul>

В конечном итоге я хочу сделать, чтобы пользователь щелкнул одну из этих ссылок и воспроизвел видео, когда видео перестает воспроизводиться, и я хочу, чтобы оно исчезло, потому что под видео есть фоновое изображение, которое я хочу показать снова.

Есть ли способ сделать это с помощью jquery, возможно, получить доступ к API YouTube?

Answer 1

Да, вы хотите добавить прослушиватель событий, используя метод API player.addEventListener(), и прослушивать событие onStateChange. Он передает число (0 для остановки, 2 для паузы и т. Д.) В зависимости от состояния проигрывателя (воспроизведение, пауза, окончание и т. Д.). Когда это событие вызывается состоянием «стоп», вы можете запустить функцию jQuery для .hide() или .remove() или для любого вашего контейнера фильма.

http://code.google.com/apis/youtube/js_api_reference.html#Events (документация player.addEventListner () верна выше этот якорь на этой странице, к вашему сведению. В противном случае легко пропустить).

РЕДАКТИРОВАТЬ: обратите внимание, что вам нужно включить API YouTube для встроенного видео, как описано здесь .