2014-01-18 44 views
0

我正在用bootstrap构建我的第一个站点。到目前为止它还算不错。滑动到远处的Bootstrap传送带

我还没有能够解决的唯一问题是:

的引导圆盘传送带滑动到远。我在旋转木马中有3个项目,每个项目有5张图片。

如果我反复按下后退按钮(没有mather多少次),旋转木马循环通过3项没有问题。

,但如果我repeatedlly按下一个按钮,第三次之后,在没有重置为0

有谁知道这可能是导致此?

<div class="row"> 
     <div class="col-sm-12 thumb_box"> 
      <div class="thumbs"> 
       <div class="well"> 
        <div id="myCarousel" class="carousel slide"> 
         <!-- Carousel items --> 
         <div class="carousel-inner"> 
          <div class="item active"> 
           <div class="row"> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
           </div> 
           <!--/row--> 
          </div> 
          <div class="item"> 
           <div class="row"> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
           </div> 
           <!--/row--> 
          </div> 
          <div class="item"> 
           <div class="row thumb_row"> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb1.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
            <div class="col-sm-2"> 
             <div class="thumb"> 
              <img src="~/img/folio_thumb2.png"> 
              <a href="#" class="mask"> 
               <div class="more">+</div> 
              </a> 
             </div> 
            </div> 
           </div> 
           <!--/row--> 
          </div> 
          <!--/carousel-inner--> 
          <a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a> 
          <a class="right carousel-control" href="#myCarousel" data-slide="next">›</a> 
         </div> 
        </div> 
       </div> 
       <!--/myCarousel--> 
      </div> 
      <!--/well--> 
     </div> 

回答

0

我发现了这个问题。 如果您遇到此问题,请检查您的div元素。 我的divs层次结构出错了。