Как перейти к следующему слайду после видео в кассете Bootstrap?

Я использую bootstrap carousel (v3.0), чтобы сместить некоторые видео и изображения youtube/vimeo. Мне нужно воспроизвести несколько видео/изображений и видео AUTOPLAY, когда видео находится на слайде. Код приводится ниже:Как перейти к следующему слайду после видео в кассете Bootstrap?

В заголовке:

<meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
<title>Custom</title> 
<link rel='stylesheet' href='http://getbootstrap.com/dist/css/bootstrap.css' type='text/css' media='all' /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type='text/javascript' src='http://getbootstrap.com/dist/js/bootstrap.js'></script>

В теле:

<div id="container"> 
    <div id="body"> 
     <div class="row"> 
      <div class="col-9" id="panel1"> 
       <div class="carousel" id="slideshow"> 
        <div class="carousel-inner"> 
         <div class="item" active> 
          <img src="http://farm2.staticflickr.com/1064/1299342518_d874c634e6.jpg" /> 
         </div> 
         <div class="item"> 
          <img src="http://farm4.staticflickr.com/3673/9585032718_52afe21449.jpg" /> 
         </div> 
         <div class="item"> 
          <iframe width="560" height="315" src="http://www.youtube.com/embed/1iIZeIy7TqM" frameborder="0" allowfullscreen data-videoid="1iIZeIy7TqM" id="C2dFFiN00SY"></iframe> 
         </div> 
         <div class="item"> 
          <h1>Parfiat</h1> 
          <p>You are here after the video!!!</p> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div>

Script ниже тела:

<script type="text/javascript" src="http://www.youtube.com/iframe_api"></script> 
<script> 
    function onPlayerReady(event) { 
     event.target.playVideo(); 
    } 

     // when video ends 
    function onPlayerStateChange(event) {   
     if(event.data === 0) {   
      alert('Video is done... how do I can add the code to advance this to next slide and or to continue slideshow?'); 
     } 
    } 

    function playVideo(videoID){ 
     //alert('this video ID is ' + videoID); 

     var player = new YT.Player(videoID, { 
        events: { 
         'onReady': onPlayerReady, 
         'onStateChange': onPlayerStateChange 
        } 
       }); 
    } 
</script> 
<script> 
    $('.carousel').carousel({ 
     interval: 2000 
    }) 

    $('.carousel').on("slide.bs.carousel", function (event) { 
     // Bootstrap carousel marks the current slide (the one we're exiting) with an 'active' class 
     var $currentSlide = $(".carousel").find(".active iframe"); 
     if ($currentSlide.length) { playVideo($currentSlide.attr("id")); } 
     if ($currentSlide.length) { onYouTubeIframeAPIReady(); }   

    }); 
</script>

Я хочу, чтобы убедиться, что это слайд-шоу продолжая в цикле. Ваша помощь с этим кодом будет принята с благодарностью.

источник

2013-10-15 user2882909