How to Get total and Current Slide Number of Carousel

carousel, jquery, slider, twitter-bootstrap

Solution

Each `slide` has a `.item` class to it, you can get the total number of slides like this

var totalItems = $('.item').length;

Active `slide` has a class named as `active`, you can get the index of `active slide` like this

var currentIndex = $('div.active').index() + 1;

You can update these values by binding the bootstrap carousel `slid` event like this

$('#myCarousel').bind('slid', function() {
    currentIndex = $('div.active').index() + 1;
   $('.num').html(''+currentIndex+'/'+totalItems+'');
});

EXAMPLE

Problem

Can you please let me know how I can get the total and current number of the carousel slides in bootstrap like the image below? I have an standard Bootstrap carousel and a `<div>` with the `.num` class to display the total and current number and I used this code to retrieve the numbers but it didn't go through ``` $('.num').html(){ $('#myCarousel').carousel({number}) } ``` Thanks Update: Please find a sample at this jsfiddle LINK

Original source