Jquery + owl.carousel - 从youtube播放视频时停止滑块

Question

我使用jquery owl caorusel（http://owlgraphic.com/owlcarousel）

滑块是2，在Youtube的这些视频中。当我点击播放时，此滑块必须停止。有人可以帮忙吗？

我的应用

// owl home
$(".slider-home .owl-carousel").owlCarousel({
    rewindNav: true,
    navigation: true,
    pagination: false,
    slideSpeed: 300,
    paginationSpeed: 400,
    singleItem: true,
    mouseDrag: false,
    autoPlay: true,
    stopOnHover: true,
    rewindSpeed: 5000,
    video:true,
    lazyLoad:false,
    afterMove : function(){
        $('video').each(function () {
            this.pause();
            $('.slider-video').next().show();
        });
    }
});

和html

<div class="slider-home">
<div class="owl-carousel owl-theme">
    <div class="item" style="background-image: url('tmp/car1920x1080.jpg');">
        <div class="item-inner">
            <div class="container">
                <div class="row">
                    <div class="col-sm-9">
                        <h1>header1</h1>
                    </div> <!-- .col -->
                </div> <!-- .row -->
            </div> <!-- .container -->
        </div> <!-- .item-inner -->
    </div> <!-- .item -->
    <div class="item disable-owl-swipe">
        <iframe class="youtube-player" width="560" height="315" src="http://www.youtube.com/embed/9UlBsQLjjWI?loop=1&playlist=9UlBsQLjjWI&controls=0&showinfo=0" frameborder="0" allowfullscreen></iframe>
        <div class="item-inner">
            <div class="container">
                <div class="row">
                    <div class="col-sm-9">
                        <h1>header2</h1>
                    </div> <!-- .col -->
                </div> <!-- .row -->
            </div> <!-- .container -->
        </div> <!-- .item-inner -->
    </div> <!-- .item -->
</div>