Bootstrap旋轉木馬不顯示指標和列表不起作用

我使用引導程序輪播（* bootstrap-carousel.js v2.2.2）。問題是，包含轉盤指示器的'ol'的風格不起作用。當我手動添加樣式到我的css文件時，它正在顯示，但當.active類從幻燈片變爲幻燈片時，它似乎沒有改變。Bootstrap旋轉木馬不顯示指標和列表不起作用

我的代碼是：

<div id="HomeCarousel" class="carousel slide"> 

    <ol class="carousel-indicators"> 
    <li id="homecar1" data-target="#HomeCarousel" data-slide-to="0" class="active"></li> 
    <li id="homecar2" data-target="#HomeCarousel" data-slide-to="1"></li> 
    <li id="homecar3" data-target="#HomeCarousel" data-slide-to="2"></li> 
    </ol> 

    <!-- Carousel items --> 
    <div class="carousel-inner"> 
    <div class="active item"><img src="<?php bloginfo('template_url'); ?>/images/home/home_carousel1.jpg" height="506px" /> </div> 
    <div class="item"><img src="<?php bloginfo('template_url'); ?>/images/home/home_carousel2.jpg" /></div> 
    <div class="item"><img src="<?php bloginfo('template_url'); ?>/images/home/home_carousel3.jpg" /></div> 
    </div> 

</div>

這樣看來jQuery的工作不那麼好太..但簡報，和上/下一個確實太少，當我加入吧..

來源

2014-01-23 Jeroen Balk

你能提供一個帶有一些工作代碼的JSFiddle嗎？你的標記看起來很好，所以如果沒有更多的代碼示例，就不可能知道什麼是錯的。 –

我真的想添加一些JSFiddle，但沒有更多的只是默認的bootstrap.js和樣式表..我從下載的引導程序css 2.3文件添加指標樣式，並使用該id來設置活動指標。我手動添加了以下js：

jQuery(document).ready(function($) { 
      $("#HomeCarousel li#ind-homecar0").click(function() { 
      $('#HomeCarousel').carousel(0); 
      }); 
      $("#HomeCarousel li#ind-homecar1").click(function() { 
      $('#HomeCarousel').carousel(1); 
      }); 
      $("#HomeCarousel li#ind-homecar2").click(function() { 
      $('#HomeCarousel').carousel(2); 
      }); 

      $('#HomeCarousel.carousel').on('slid', function() { 
      var to_slide = $('#HomeCarousel .carousel-inner .item.active').attr('id'); 
      $('#HomeCarousel .carousel-indicators').children().removeClass('active'); 
      $('#HomeCarousel .carousel-indicators [id=ind-' + to_slide + ']').addClass('active'); 
      }); 

      });

來源

2014-01-27 09:49:04

Bootstrap旋轉木馬不顯示指標和列表不起作用

回答

相關問題