Html 引导carousal：打开单击的图像

我正在用bootstrap3制作一个lightbox-carousel-modal页面。到目前为止，一切进展顺利，除了一件事： 当旋转木马启动时，它总是从页面的第一个图像开始，而不是我单击的图像。 换句话说：如果我点击图像1，图像1打开；如果我点击图像2，图像1打开；如果我点击图像3，图像1打开。 在那之后，旋转木马工作正常，但我想要的是，当我点击图像2时，图像2打开，如果我点击图像3，图像3打开

一些代码：

  <ul class="cropped-images">
    <li class="la active"><a data-content="No 1" href="#lightbox" data-toggle="modal" data-slide-to="0"><img src="images/thumbs/1.jpg" alt="No 1"></a></li>
    <li class="la"><a data-content="No 2" href="#lightbox" data-toggle="modal" data-slide-to="1"><img src="images/thumbs/2.jpg" alt="No 2"></a></li>
    <li class="la"> etc... </ul>

    <div id="lightbox" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
      <div class="modal-dialog modal-lg">
         <div class="modal-content">  
           <div class="modal-header">
             <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
             <h4 class="modal-title">TITLE</h4>
                            </div>
             <div id="carousel-example-generic" class="carousel slide">
             <!-- Wrapper for slides -->
                <div class="carousel-inner">
                  <div class="item active">
                    <img src="images/large/1.jpg" alt="...">
                    <div class="carousel-caption">One Image</div>
                  </div>
                  <div class="item">
                    <img src="images/large/2.jpg" alt="...">
                    <div class="carousel-caption">Another Image</div>
                  </div>
                  ... etc...
                  <!-- Controls -->
                  controls code
               </div>
             </div> 
          </div>
       </div>

等等
&时代；
标题
一个图像
另一个图像
... 等
控制代码

有什么建议吗？

您可以使用创建自己的自定义灯箱，如我在下面的代码片段中尝试显示的，请查看：

$（'.content holder.缩略图'）。每个（函数（i）{
var项目=$（''）；
var itemDiv=$（this.parents（'div'）；
var title=$（this.parent（'a'）.attr（“title”）；
项目属性（“标题”，标题）；
$（itemDiv.html（））.appendTo（item）；
项目.附件（'.carousel-inner'）；
如果（i==0）{//将第一项设置为活动项
item.addClass（“活动”）；
}
});
/*启动旋转木马*/
$（'modalCarousel'）.carousel（{interval:false}）；
/*幻灯片更改时更改模式标题*/
$（'modalCarousel'）.on（'slided.bs.carousel'，函数（）{
$（'.modal title'）.html（$（this.find（'.active'）.attr（“title”））；
});
/*单击缩略图时*/
$（'.row.缩略图'）。单击（函数（）{
var idx=$（this.parents（'div'）.index（）；
var id=parseInt（idx）；
$（'#myModal'）.modal（'show'）；//显示模态
$（'#modalCarousel'）.carousel（id）；//将carousel滑动到选定位置
});
缩略图{
高度：100px；
利润率：6px；
}
.缩略图{
边缘底部：6px；
}
.转盘-控制装置。左侧{
背景图像：无；
位置：绝对位置；
最高：50%；
左：0；
宽度：25px；
身高：100%；
转化：translateY（-50%）；
}
.转盘控制，对{
背景图像：无；
位置：绝对位置；
最高：50%；
右：0；
宽度：25px；
身高：100%；
转化：translateY（-50%）；
}
.项目.缩略图{
保证金：0自动；
}
身体{
利润率：20px！重要；
}

&时代；
灯箱
试着做这样的事情

只需在html代码中替换下一行即可

<div id="carousel-example-generic" class="carousel slide">



到


可能重复的图像，但我已经准备好了一些工作，只需要找出如何从lightbox中的任何图像（而不仅仅是第一个）开始。这值得更多的分数。我一直在找这个。谢谢你的时间这是我的荣幸@Poemko
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">