簡體   English   中英

導航欄無法正常運行(Bootstrap v3)

[英]Navbar not working properly(bootstrap v3)

我的導航欄行為不正確。 它同時在垂直行中同時顯示3個滑塊圖像,並且不會在圖片中滑動。 使用的CSS是twitter bootstrap的CSS。 我在那里有自己的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>

小提琴

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM