Как остановить видео youtube в JS?

Question

[Vince]

Приветствую.

Купил я один плагин слайдера для WP. Умудрился как-то сделать так, чтобы слайдер из категории выводил видео , а не превью. Но вот есть мелкая неприятность )

У меня 7 слайдов в слайдере. Каждый - это embed видео с youtube. Автоматом не играются. Но теперь думаю, что бы такого дописать в JS плагина чтобы при переключении слайда видео из предыдущего слайда останавливалось само.

Это может быть и не сильно критично, т.к. видео все не длиннее двух минут, но всёже. Если человек включил одно видео, перешёл на другой слайд и включил другое - то как-то не круто.

Буду рад если подскажете.

Comments

[Сёмка Гавриленко]

Вы решили свой вопрос?

Answer 1

[Даулет Ногайбек]

Была аналогичная ситуация, надо было когда открывается модальное окно воспроизвести а если закрыть нажать на паузу, нашел решение!

<script>
		$(document).on('click', '#close_vid', function() {
			jQuery("iframe").each(function() {
				jQuery(this)[0].contentWindow.postMessage('{"event":"command","func":"pauseVideo","args":""}', '*')
			});
		});
	</script>
	<script>
		$(document).on('click', '#play_video', function() {
			jQuery("iframe").each(function() {
				jQuery(this)[0].contentWindow.postMessage('{"event":"command","func":"playVideo","args":""}', '*')
			});
		});
	</script>

PS: https://www.youtube.com/embed/SMExDCDusx4?enablejsapi=1& - вот таким образом надо включить API

Comments

[Mykhailo]

ооо) спасибо!)

[MKE]

Спасибо за P.S. !
Немаловажный момент! )

Answer 2

[Сёмка Гавриленко]

<script>
function toggleVideo(state) {
    // if state == 'hide', hide. Else: show video
    var div = document.getElementById("popupVid");
    var iframe = div.getElementsByTagName("iframe")[0].contentWindow;
    div.style.display = state == 'hide' ? 'none' : '';
    func = state == 'hide' ? 'pauseVideo' : 'playVideo';
    iframe.postMessage('{"event":"command","func":"' + func + '","args":""}', '*');
}
</script>

<p><a href="javascript:;" onClick="toggleVideo();">Click here</a> to see my presenting showreel, to give you an idea of my style - usually described as authoritative, affable and and engaging.</p>

<!-- popup and contents -->
<div id="popupVid" style="position:absolute;left:0px;top:87px;width:500px;background-color:#D05F27;height:auto;display:none;z-index:200;">
   <iframe width="500" height="315" src="http://www.youtube.com/embed/T39hYJAwR40?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
   <br /><br />
   <a href="javascript:;" onClick="toggleVideo('hide');">close</a>

Более подробно тут stackoverflow.com/questions/8667882/how-to-pause-a...
и в гугле по запросу "js stop youtube video in iframe"

Comments

[xtozna]

Спасибо, как раз то, что искал.

Answer 3

[Александр Соловей]

Можно навесить вот такое собыите

var videoSrc = $("#Player1").attr("src");
$("#Player1").attr("src","");
$("#Player1").attr("src",videoSrc);