javascripthtmlcssbootstrap-carousel

Detect that Bootstrap carousel ended

I would like to know if there is any way to detect when the Bootstrap carousel finishes running, since I need to execute a function when the carousel reached the last element.

I apply here the question to a comment to see it in a better format:

const carousel = document.getElementById("carouselContainer");

carousel.addEventListener("slid.bs.carousel", function (e) {
    if (e.direction === "right" && e.to === elements.length - 1) {
      // Take an action
    }
  });

Solution

  • Yes, check documentation: you should compare from and to according to direction.

    
if (direction == 'left' && to == 0) {
    startReached();
}

if (direction == 'right' && to == elements.length - 1) {
    endReached();
}