Bootstrap Karussell mit Thumbnails (Multiple Carousel)
Ich habe nachgeschlagen, wie ein Bootstrap-Karussell mit Miniaturansichten erstellt werden kann. Dabei bin ich auf Folgendes gestoßen:http: //jsfiddle.net/xuhP9/67
$('#myCarousel').carousel({
interval: 4000
});
$('[id^=carousel-selector-]').click(function () {
var id_selector = $(this).attr("id");
var id = id_selector.substr(id_selector.length - 1);
id = parseInt(id);
$('#myCarousel').carousel(id);
$('[id^=carousel-selector-]').removeClass('selected');
$(this).addClass('selected');
});
$('#myCarousel').on('slid', function (e) {
var id = $('.item.active').data('slide-number');
id = parseInt(id);
$('[id^=carousel-selector-]').removeClass('selected');
$('[id^=carousel-selector-' + id + ']').addClass('selected');
});
Was gut funktioniert, ich muss jedoch mehrere Karussells auf einer Seite haben, und ich bin nicht ganz sicher, wie ich das erreichen kann. Ich war müde, den ID-Selektor in einen Klassen-Selektor zu verwandeln, damit ich mehr als einen erstellen kann. Ich bin mir jedoch nicht sicher, wie ich die JS-Funktionalität tatsächlich reparieren soll, damit sie funktioniert, da sie zusammengeblendet zu sein scheinen.
rundsätzlich versuche ich Folgendes zu erreichen:http: //jsfiddle.net/xuhP9/70 aber ohne das JS für jedes unabhängige Karussell zu wiederholen, das ich erstelle.
Danke im Voraus