동영상 재생 중 플렉스 슬라이더 중지

Question

그림 및 비디오를 표시하기 위해 flexslider 플러그인을 사용하고 있습니다. 슬라이드는 자동으로 변경되며 나에게 도움이됩니다. 문제는 사용자가 동영상 (iframe을 YouTube에서 재생)을 재생하면 flexslider이 슬라이드를 계속 변경한다는 것입니다.

설명서를 확인한 결과, 어느 정도 마술을하지만, 비디오가 시작될 때 일시 중지하고 비디오가 일시 중지되거나 끝날 때 계속 진행하는 것이 더 낫습니다. 이것을 처리하는 방법에 대한 제안? 이 같은 somethnig,

<div class="span6 animated fadeInLeftBig" id="main-media"> 
    <iframe width="560" height="315" src="https://www.youtube.com/embed/someID?version=3&enablejsapi=1" frameborder="0" allowfullscreen id="iframe-id"></iframe> 
    </div> 

Answer 1

이 문제를 해결하는 가장 좋은 방법은, 유튜브 API를 사용하는 것입니다 : 여기에 편집

가 iframe을 열 때 사업부의

//Implement Youtube API 
(function(){ 
    var s = document.createElement("script"); 
    s.src = "http://www.youtube.com/player_api"; /* Load Player API*/ 
    var before = document.getElementsByTagName("script")[0]; 
    before.parentNode.insertBefore(s, before); 
})(); 

var YT_ready=(function(){var b=[],c=false;return function(a,d){if(a===true){c=true;while(b.length){b.shift()()}}else if(typeof a=="function"){if(c)a();else b[d?"unshift":"push"](a)}}})(); 
YT_ready(function() { 
    (function($) { 
      var frameID = "yourIframeID" 
      var player = new YT.Player(frameID, { 
        events: { 
         "onStateChange": function(event) { 
          if (event.data == 1 || event.data == 3) { 
           $('.flexslider').flexslider("pause"); 
          } 
          else if (event.data == 0 || event.data == 2 || event.data == 5) { 
           $('.flexslider').flexslider("play"); 
          } 
         } 
        } 
       }); 
     }); 



    })(jQuery); 
function onYouTubePlayerAPIReady() { 
    YT_ready(true) 
}