jQuery 克隆 div 内的活动 img 并使其成为 div 的背景图像

Question

这是我目前拥有的 html：

<div class="testimonials">
  <div class="item active">
    <div class="testimonial-bg"></div>
    <div class="testimonial-img">
        <img src="img/testimonial-img1.jpg" alt="" />
        <p>
            Hanna's Story
        </p>
    </div>
  </div>
  <div class="item">
    <div class="testimonial-bg"></div>
    <div class="testimonial-img">
        <img src="img/testimonial-img2.jpg" alt="" />
        <p>
            Hanna's Story
        </p>
    </div>
  </div>
</div>

我希望“.item”中具有“active”类的 img 标签也成为 .testimonials 的背景图像。随着每张幻灯片的变化，项目图像会改变，因此这个背景图像也应该改变。我该怎么做？

滑块是引导程序的默认轮播。代码可以看这里：
http://codepen.io/anon/pen/aNjaEQ

Answer 1

$(".item.active").each(function() {

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

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

});