2014-10-01 60 views
1

我已经构建了一个引导视频轮播。它工作得很好,但我唯一的问题是旋转木马在5秒后继续滑动到下一张幻灯片。如何让它停止自动滑动,并且只在用户点击左侧或右侧箭头时滑动?我粘贴了下面的代码。如何阻止Bootstrap旋转木马从自动翻转?

<div class="container"> 
     <div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-pause=hover> 
      <!-- Indicators --> 
      <ol class="carousel-indicators"> 
       <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> 
       <li data-target="#carousel-example-generic" data-slide-to="1"></li> 
       <li data-target="#carousel-example-generic" data-slide-to="2"></li> 
      </ol> 

      <!-- Wrapper for slides --> 
      <div class="carousel-inner"> 
       <div class="item active"> 
        <div class="embed-responsive embed-responsive-16by9"> 
         <video class="embed-responsive-item" autoplay muted id="homevid"> 
          <source src="C:\Development Software\Sample Website\videos\Michael Vick 88 yard touchdown pass to DeSean Jackson.mp4" /> 
         </video> 
        </div> 
       <div class="carousel-caption"> 

      </div> 
     </div> 
      <div class="item"> 
       <div class="embed-responsive embed-responsive-16by9"> 
        <video class="embed-responsive-item" autoplay muted id="homevid"> 
         <source src="C:\Development Software\Sample Website\videos\Vick to Jeremy Maclin for 50 Yard TD.mp4" /> 
        </video> 
       </div> 

      </div> 
      <div class="item"> 
       <div class="embed-responsive embed-responsive-16by9"> 
        <video class="embed-responsive-item" autoplay muted id="homevid"> 
         <source src="C:\Development Software\Sample Website\videos\Michael Vick Scramble Plays vs Rams 2011.mp4" /> 
        </video> 
       </div> 
      </div> 
    </div> 

回答

6

通过添加data-interval="false"

<div id="carousel-example-generic" class="carousel slide" data-interval="false" data-ride="carousel" data-pause="hover" > 

documentation

选项 - 间隔 - ..如果假,旋转木马不会自动循环。