在Bootstrap Carousel上更改活动类时更改背景

Question

我想在每次滑块滑动时更改容器的背景.我想我需要检查项目的类是否/何时因为活动.我也想知道是否有一个我应该听的事件.这是我正在研究的jsfiddle:

https://jsfiddle.net/podbarron/nj04xms5/

$(function(){
$('#carousel-indicators').on('click', 'li', function(){

});
});

谢谢!

Answer 1

Bootstrap Carousel具有在每次幻灯片转换时/之后触发的事件.你应该能够使用它.

示例:https://jsfiddle.net/nj04xms5/7/

活动中的js是非常基本的,但只是为了给你一个想法.

e.relatedTarget 如果您想从中获取信息(即ID),您将获得当前幻灯片

$('#carousel-example-generic').on('slide.bs.carousel', function(e) {
      if(e.relatedTarget.id == 'firstSlide'){
          $("#landingContainer").css('background-color', 'orange');
      } else if(e.relatedTarget.id == 'secondSlide'){
          $("#landingContainer").css('background-color', 'green');
      }
})