0

我有一个关于在引导程序上堆叠容器的问题。

我希望制作一个类似于 powerpoint 演示文稿的页面，其中显示图像并单击后，它会隐藏当前容器并移至下一个容器。这种设计将要求容器/幻灯片按顺序堆叠在一起。我希望在页面加载时准备 10 个容器/幻灯片。

到目前为止，我能想到的最接近的东西是引导程序的“标签”功能。

还有其他更好的解决方案吗？

<div class="tab-content">
        <div class="tab-pane active">
           ......
        </div>
</div>

但是我的解决方案的问题是显示了选项卡按钮。我只需要让堆叠的容器在单击它们后一个接一个地显示出来。

4

1 回答 1

4

尝试使用引导程序的轮播而不是选项卡

<div id="myCarousel" class="carousel slide">
    <ol class="carousel-indicators">
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
    <li data-target="#myCarousel" data-slide-to="1"></li>
    <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>
    <!-- Carousel items -->
    <div class="carousel-inner">
    <div class="active item">…&lt;/div>
    <div class="item">…&lt;/div>
    <div class="item">…&lt;/div>
    </div>
    <!-- Carousel nav -->
    <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
    <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
</div>

http://twitter.github.io/bootstrap/javascript.html#carousel

于 2013-05-08T05:16:08.667 回答