我使用twitter bootstrap的默认carousel作为一个简单的滑块。我想要实现的是,无论哪个项目是活动的,该项目中的img也应该被克隆,并设置为div的背景图像,其类为“meterinals bg”。
我尝试了以下代码,但似乎不起作用:

$("#testimonial-carousel .item.active").each(function() {

      var $myBg  = $(".testimonial-bg", this),
          $myImg = $(".testimonial-img img", this);

      $myBg.css({backgroundImage: "url('"+ $myImg[0].src +"')"});

    });

我做了一把小提琴:
https://jsfiddle.net/4t17wxxw/

最佳答案

订阅slid.bs.carousel事件并将背景图像更改为活动图像:

var $myBg  = $(".testimonial-bg");

  $('#testimonial-carousel').on('slid.bs.carousel', function () {
      var $img = $('img','.carousel-inner>.item.active');
      $myBg.css({backgroundImage: "url('"+ $img[0].src +"')"});
      console.log($img[0].src);
  });

Working fiddle

10-05 20:39
查看更多