Question

I have multiple text based links i would like to connect into the carousel, making it so if someone clicks a link, it rotates the carousel to the corresponding display.

Additionally I would like to make it so these links have a different color through CSS if the carousel is currently on the display that goes with that link.

I am new to bootstrap, this is my first time trying to work with it. Any help or suggestions would be appreciated.

Answer 1

Try to use next scheme:

1. Markup

2. Javascript

   $("#Carousel").carousel({
       interval: 5000,
       pause: "hover"
   });
   
   $("#Carousel").bind("slid", function() {
       var a = $("#Carousel .item.active").index();
       $("#CarouselControls .carousel_control ").removeClass("active").eq(a).addClass("active")
   });
   
   $("#CarouselControls .carousel_control ").click(function() {
       var a = $(this).index();
       $("#CarouselControls .carousel_control ").removeClass("active").eq(a).addClass("active");
       $("#Carousel").carousel(a)
   })