导航栏无法正常工作(引导程序 v3）

Navbar not working properly(bootstrap v3)

本文关键字：工作 引导程序 v3 常工作 导航      更新时间：2023-09-26

我的导航栏行为不正确。它同时在垂直行中显示 3 个滑块图像，并且不会在图片中滑动。使用的CSS是Twitter引导程序的CSS。我在那里有自己的CSS，但没有影响轮播，也没有添加javascript，只有Jquery和bootstrap.js。这是引导程序 V3。知道吗？

<div class="container">
   <div id="carousel-example-generic" class="carousel slide">
      <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>
      <div class="carousel-inner">
         <div class="item active">
            <img src="img/timthumb.jpg" alt="...">
            <div class="carousel-caption">
               <p>Eyes of the owl</p>
            </div>
         </div>
         <div class="item active">
            <img src="img/timthumb.jpg" alt="...">
            <div class="carousel-caption">
               <p>Eyes of the owl</p>
            </div>
         </div>
         <div class="item active">
            <img src="img/timthumb.jpg" alt="...">
            <div class="carousel-caption">
               <p>Eyes of the owl</p>
            </div>
         </div>
      </div>
      <!-- Controls -->
      <a class="left carousel-control" href="#carousel-
         example-generic" data-slide="prev">
      <span class="icon-prev"></span>
      </a>
      <a class="right carousel-control" href="#carousel-
         example-generic" data-slide="next">
      <span class="icon-next"></span>
      </a>
   </div>
</div>

您的问题似乎是您为所有幻灯片指定了active类。仅指定第一个开始。为所有这些指定active使它们都可见，并且其选择器在幻灯片中切换（不是活动项目，在单击按钮时是上一个或下一个无法拾取其他任何内容）无法选择，因为没有任何非活动不再可用。

            <div class="item active">
                <img src="http:''placehold.it'32x100" alt="..." />
                <div class="carousel-caption">
                    <p>Eyes of the owl</p>
                </div>
            </div>
            <div class="item"> <!-- removed active class from here -->
                <img src="http:''placehold.it'42x100" alt="..." />
                <div class="carousel-caption">
                    <p>Eyes of the owl</p>
                </div>
            </div>
            <div class="item"><!-- removed active class from here -->
                <img src="http:''placehold.it'52x100" alt="..." />
                <div class="carousel-caption">
                    <p>Eyes of the owl</p>
                </div>
            </div>

小提琴

相关文章：