How to disable bootstrap carousel animation?

Question

For example I have carousel with 3 images, when the carousel slides the new images are added via 'slid' event

$('#imageCarousel').on('slid', function (event) {
      //add more images
});

I want to disable animation for the carousel, so transition time is set to 0 in carousel css as it was shown here removing carousel animation. But after that 'slid' event does not fire. I cannot use 'slide' event, because I need to know which item is active in the carousel, but the 'active' class is not set up after the 'slide' event. How can I solve it? Thanks.

Answer 1

I suppose you can use the following code,

just remove the slide class from carousel div and use like,

<div class="carousel"> 

this will remove the slide animation effect, see the working fiddle,