0

我在自己编写的图像查看器的叠加层中有这个 html 代码：

<div class="carousel slide" id="imgViewer">
        <div class="carousel-inner">
            <div id="item1" class="item active">
                <div id="pic1">
                    <center>
                          <img style="height: 100%;" src="./upload/offers/6/img.jpg" alt="">
                    </center>
                 </div>
            </div>
            <div id="item2" class="item ">
               <div id="pic2">
                 <center>
                   <img style="height: 100%;" src="./upload/offers/6/img2.jpg" alt="">
                 </center>
                </div>
            </div>
</div>
</div>

这是主视图（左侧的滑块。）

在右侧，我有另一个视图，可以查看滑块中可查看的所有图像。这是我最后一次尝试...

<a href="#item1" data-toggle="carousel-toggle" data-slide=""><img style="vertical-align: middle;" src="./upload/offers/6/img.jpg" alt="" /></a>

问题是：它不像这样工作...我想跳到滑块中单击的图像...我怎么能意识到这一点？

4

2 回答 2

2

您可以向图像添加 onClick 事件。该事件可以将类更改为在您要显示的图像的 div 上处于活动状态。

<div id="item1" class="item active">

“活动”类是正在显示的幻灯片。

于 2013-06-03T09:06:46.653 回答
1 
$('#item1').click(function() {
                $('#item1, #item2, #item3, #item4, #item5, #item6, #item7').removeClass('active');
                $('#item1').addClass('active');
                return true;
            });

好吧，我想我可以用引导程序来做到这一点，比如数据切换轮播......

data-slide-to

这将适用于所有正在搜索它的人......

于 2013-06-03T09:09:52.193 回答