Twitter Bootstrap Карусель - индекс текущего доступа

Question

Как получить текущий показатель из карусели?

В этом случае я использую неупорядоченный список. Я знаю, что я мог бы искать элементы списка, чтобы найти тот, у кого есть «активный» класс CSS, но я хочу знать, могу ли я напрямую спросить объект карусели.

Дополнительно: возможность доступа к целевому индексу (на мероприятии «слайд») также будет полезна. Опять же, я могу сделать это с помощью функции поиска с:

var idx = $('.carousel-inner li.active').index(); 

... и затем добавление/вычитание на основе направления, но я надеюсь на что-то уборщиком.

Answer 1

Нет, нет способа получить доступ к указателю или направлению.

See here

// EDIT

Bootstrap изменил сделок РЕПО, новые link

Answer 2

Я делаю это так, что работает вроде очень хорошо;)

var slider = $("#slider-wrapper") 
    .carousel({ 
     interval: 4000 
    }) 
    .bind('slid', function() { 
     var index = $(this).find(".active").index(); 
     $(this).find("a").removeClass('pager-active').eq(index).addClass('pager-active'); 
    }); 

$("#slider-wrapper a").click(function(e){ 
    var index = $(this).index(); 
    slider.carousel(index); 
    e.preventDefault(); 
}); 

Answer 3

Вместо добавления и вычитания из текущего слайда, попробуйте это на событии «слайд»:

$('.carousel').on('slide',function(e){ 
    var slideFrom = $(this).find('.active').index(); 
    var slideTo = $(e.relatedTarget).index(); 
    console.log(slideFrom+' => '+slideTo); 
}); 

Answer 4

Вот что я придумал после прочтения комментария жира в ответе @ Quelltextfabrik.

var carousel = $("#myCarousel"); 

carousel.on("slid", function() { 
    var all = carousel.find('.item'), 
     active = carousel.find('.active'), 
     slidTo = all.index(active); 

    console.log("Slid - Slid To: " + slidTo); 
    }); 

carousel.on("slide", function() { 
    var all = carousel.find('.item'), 
     active = carousel.find('.active'), 
     slidFrom = all.index(active); 

    console.log("Slide - Slid From: " + slidFrom); 
}); 

Answer 5

$(".active", e.target).index() работает. Там, где е от:

carousel.on ("скользили", функция (е) {$ ( , e.target) .index(); "активный."});

Найдено по: https://github.com/twitter/bootstrap/pull/2404#issuecomment-4589229

Answer 6

Это работало для меня (Bootstrap 3)

$("#myCarousel").on('slide.bs.carousel', function(evt) { 
    console.debug("slide transition started") 
    console.debug('current slide = ', $(this).find('.active').index()) 
    console.debug('next slide = ', $(evt.relatedTarget).index()) 
}) 

Answer 7

Для начальной загрузки 3 это

$('#myCarousel').on('slide.bs.carousel', function (e) { 
    var active = $(e.target).find('.carousel-inner > .item.active'); 
    var from = active.index(); 
    var next = $(e.relatedTarget); 
    var to = next.index(); 
    console.log(from + ' => ' + to); 
}) 

из https://github.com/twbs/bootstrap/pull/2404#issuecomment-22362366

Answer 8

Bootstrap 4, наконец, имеет нативный реализации этого.

direction: The direction in which the carousel is sliding (either "left" or "right"). 
relatedTarget: The DOM element that is being slid into place as the active item. 
from: The index of the current item 
to: The index of the next item 

https://github.com/twbs/bootstrap/pull/21668

$('#myCarousel').on('slide.bs.carousel', function (e) { 
    // current index 
    e.from 
    // next index 
    e.to 
}