Остановить (выключить) видео youtube при клике на body?

Question

[Сергей Миллер]

Привет, Господа.

На странице несколько youtube видео. Мне нужно было чтобы при клике на картинку, у которой есть свой id видео, которое тоже имеет свой id начало воспроизводиться. В инете нашел такой скрипт:

<script>
$(document).on('click', '.open_window', function() {
	var $video = $('#you_video'),
		src = $video.attr('src');
 
	$video.attr('src', src + '&autoplay=1');
});
</script>

Всё работает, но допустим нужно чтобы видео еще как-то останавливалось при клике на body. Я пробовал изменить в скрипте чтобы при клике на body значение автоплей стало равно нулю (autoplay=0), это сработало, но почему-то только на 1 секунду.

<script>
$(document).on('click', 'body', function() {
	var $video = $('#you_video'),
		src = $video.attr('src');
 
	$video.attr('src', src + '&autoplay=0');
});
</script>

То есть нажимаю на картинку - видео начинается - нажимаю на body - видео останавливается на 1 секунду и снова начинается сначала.

Может кто-то поможет как при клике на body остановить видео с концами пока я не кликну на нужную картинку для запуска видео снова?

Answer 1

[Сергей Миллер]

Нашел такое решение кому будет надо пользуйте, только ставьте свои классы или id:

<script>
$(document).on('click', '.open_window', function() {
    var $video = $('#you_video'),
        src = $video.attr('src');

    $video.attr('src', src + '&autoplay=1');
});
</script>
<script>
$(document).on('click', '.overlay', function(){
   jQuery("iframe").each(function() {
      jQuery(this)[0].contentWindow.postMessage('{"event":"command","func":"pauseVideo","args":""}', '*')});
});
</script>

PS: в html коде самого видео ютюба, после ссылке надо дописать api ютюба - enablejsapi=1

Всем добра!