橫幅轉輪的動態轉盤指示燈

我在現有的DIV結構周圍注入股票引導輪播。這些指標是可以點擊的，但他們不旋轉或突出時，各項指標均點擊

定製的jQuery的幾行字下面會發現.carousel-inner多數民衆贊成包裹DIV和附加一個轉盤指標對於有序列表中的每個項目。

$(".carousel-inner div.item").each(function(i) { 
      $('.carousel-indicators').append("<li data-target='#carousel-example-generic' data-slide-to='' class=''></li>"); 
    });

最後，自定義的jQuery會發現每個列表項和一個整數連接data-slide-to。但是，我不知道爲什麼指標不隨橫幅旋轉。

$("ol.carousel-indicators li").attr("data-slide-to", function(i, attr) { 
      $("ol.carousel-indicators li").first().addClass('active'); 
      return attr + (i + 0) 
     });

下面是完整的自定義jQuery的動態構建指標：

$(document).ready(function(){ 
    $(".modAcTitle.modAcActive, .ac_expand").remove() // kill this, its not needed. 
    $(".modAcContent").unwrap(); //good 
    $(".modAcContent").addClass('item').removeClass('modAcContent'); //fixes items 
    $(".item").first().addClass('active'); 
    $(".carousel-inner div.item").each(function(i) { 
      $('.carousel-indicators').append("<li data-target='#carousel-example-generic' data-slide-to='' class=''></li>"); 
    }); 
    $("ol.carousel-indicators li").attr("data-slide-to", function(i, attr) { // give each section its own id 
     $("ol.carousel-indicators li").first().addClass('active'); 
     return attr + (i + 0) 
    }); 
});

來源

2016-08-09 Evan

我想我應該剛剛GOOGLE了它，因爲這是解決方案。

來源：https://coderwall.com/p/4ulwtg/auto-generate-twitter-bootstap-carousel-indicators

<!-- auto-generate carousel indicator html --> 
var myCarousel = $(".carousel"); 
myCarousel.append("<ol class='carousel-indicators'></ol>"); 
var indicators = $(".carousel-indicators"); 
myCarousel.find(".carousel-inner").children(".item").each(function(index) { 
    (index === 0) ? 
    indicators.append("<li data-target='#myCarousel' data-slide-to='"+index+"' class='active'></li>") : 
    indicators.append("<li data-target='#myCarousel' data-slide-to='"+index+"'></li>"); 
});  

<!-- then call carousel --> 
$('.carousel').carousel();

演示：http://output.jsbin.com/sitayikuko/

來源

2016-08-09 19:41:34 Evan

橫幅轉輪的動態轉盤指示燈

回答

相關問題