与自举轮播中的中心图像对齐

Question

这就是我所拥有的：

我想使每个图像出现在轮播的中心。 这是我决定实施的JavaScript代码：

$('.carousel-inner img').each(function(){
    // image dimensions
    var w = $(this).width();

    //get parent dimensions
    var div_w =$(".carousel-inner").width();

    //set img position
    this.style.left = div_w / 2 - w / 2 + 'px';
});

此代码应根据其宽度调整每个图像的左边界。 问题在于此代码将为每张幻灯片中的每张图片应用第一张图片的左边距； 相反，它应该为每个图像分别计算边距。

谢谢

Answer 1

.active类似乎已分配给正在显示的图像的父元素

尝试

if ($(this).parent("div.item").is(".active")) {
  this.style.left = div_w / 2 - w / 2 + 'px';
}