YouTube動画の再生中にjCarouselを一時停止させるにはどうすればよいですか？

Question

私はいくつかのYouTube動画のためにjCarousel（jquery）を実行しています。カルーセルは素晴らしい作品で、スライド上にマウスを置くと一時停止しますが、ビデオが再生されていてもカーソルをスライドから外すと再開します。

動画はYouTubeプレーヤーAPIを使用して埋め込まれています。

プラグイン：http://sorgalla.com/jcarousel/

これは私が使用しているカルーセルコードは次のとおりです。

<script type="text/javascript"> 
function mycarousel_initCallback(carousel, item, idx, state){ 
    // Disable autoscrolling if the user clicks the prev or next button. 
    carousel.buttonNext.bind('click', function() { 
     carousel.startAuto(0); 
    }); 

    carousel.buttonPrev.bind('click', function() { 
     carousel.startAuto(0); 
    }); 

    // Pause autoscrolling if the user moves with the cursor over the clip. 
    $('#mycarousel').hover(function() { 
     carousel.stopAuto(); 
    }, function() { 
     carousel.startAuto(); 
    }); 

}; 

$(function() { 
    $('#mycarousel').jcarousel({ 
     auto: 2, 
     wrap: 'both', 
     initCallback: mycarousel_initCallback 
    }); 
}); 
</script> 

YouTubeのスクリプト：

<script> 
    var tag = document.createElement('script'); 
    tag.src = "http://www.youtube.com/player_api"; 
    var firstScriptTag = document.getElementsByTagName('script')[0]; 
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 
    var done = false; 
    var player; 

function onYouTubePlayerAPIReady() { 
    player = new YT.Player('player', { 
     height: '505', // 535 
     width: '900', 
     videoId: 'DxZve0UV6UM', 
     playerVars: { 
     'autoplay': 0, 
     'controls': 0, 
     'modestbranding': 1, 
     'wmode': 'opaque' 
     }, 
     events: { 
     'onReady': onPlayerReady, 
     'onStateChange': onPlayerStateChange 
     } 
    }); 
} 
function onPlayerReady(evt) { 
    player.setPlaybackQuality('hd720'); 
} 
function onPlayerStateChange(evt) { 

    if (evt.data == YT.PlayerState.PLAYING && !done) { 

     done = true; 
    } 
} 
function stopVideo() { 
    player.stopVideo(); 
} 
</script> 

そしてHTML ...

   <ul id="mycarousel" class="jcarousel-skin-tango"> 
        <li> 
         <div id="player"></div> 
        </li> 
        <li> 
         <div id="player"></div> 
        </li> 
       </ul> 

いずれかのsuggエスチュアリ？プレイヤーがイベントをトリガするとき

Answer 1

単にcarousel.startAuto()とcarousel.stopAuto()を呼び出す：

function onPlayerStateChange(evt) { 
    if(evt.data == YT.PlayerState.PLAYING) { 
     global_carousel.stopAuto(); // Stop the carousel, if video is playing 
    } else { 
     global_carousel.startAuto(); // Otherwise, start it 
    } 
} 

編集：
をmycarousel_initCallback内部変数carouselがグローバル作る：

var global_carousel; 
function mycarousel_initCallback(carousel, item, idx, state) { 
    global_carousel = carousel; 
    //Other code 

その後に代わりにそれを使用コードを前に（私が編集したように）。