Zręczny suwak - Zatrzymaj klip w YouTube, gdy suwak przejdzie do następnej klatki.

Question

Używam suwaka jako wielokrotnego suwaka galerii, a jednym z elementów jest klip na YouTube. Wszystko działa wspaniale, z wyjątkiem sytuacji, gdy użytkownik kliknie następny lub poprzedni slajd, który będzie nadal odtwarzany. Nie mogę znaleźć żadnej dokumentacji dotyczącej automatycznego wstrzymywania lub zatrzymywania klipu YouTube, gdy jest poza ramką.

Answer 1

Używam zręczny v1.5.9 i rozwiązać ten problem, obecnie używam jquery.each pętli wszystkich iframe i zapytać każdego z iframe, aby zatrzymać odtwarzanie po Slick suwaka afterChange zdarzenie zostało wyzwolone.

Jak zatrzymać iframe:

można odnieść here umieć zatrzymać/wstrzymać iframe YouTube.

Slick suwaka afterChange wydarzenie:

Możesz przejść do github Slick-suwak, aby dowiedzieć się więcej o jego events/settings

Poniżej jest moje kodów dla odniesienia:

$('.hero-slider').on('init', function(event, slick){ 
    //init code goes here 
}).on('afterChange',function(e,o){ 
    //on change slide = do action 
    $('iframe').each(function(){ 
     $(this)[0].contentWindow.postMessage('{"event":"command","func":"' + 'stopVideo' + '","args":""}', '*');  
    }); 
}).slick(); 

p/s: pamiętaj, że parametr ifrube w parametrze iframe umożliwia: isjsapi = 1:

<iframe src="https://www.youtube.com/embed/xxxxxx?autoplay=0&enablejsapi=1"></iframe>