0

我正在尝试使用引导轮播（幻灯片）。我复制了代码和所有内容，但下一个按钮位于滑块之外。运行代码在这里：在此处输入链接描述 如果您看到，现在右箭头（下一步按钮）在图像之外。我试图放置一个带有 row 的 div 和一个带有 span6 或 8 的 div 但没有用。

    <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="row">
    <div class="span8">    
        <div class="carousel-inner">
            <div class="active item"><img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-03.jpg"> </div>
            <div class="item"> <img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-01.jpg">       
            </div>
            <div class="item"><img src="http://twitter.github.io/bootstrap/assets/img/bootstrap-mdo-sfmoma-02.jpg"> </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>
    </div><!-- span -->
    </div>    <!-- row -->

我想要的是在每个幻灯片的左侧放置一个图像，在右侧放置一个段落，然后按 Next 和 Prv 按钮，它应该会显示。我的问题如下：

  1. 如何将两个按钮都放置在图像之外（左侧和右侧）？
  2. 如何像“上一个”按钮一样在图像上显示下一个按钮（右箭头）？
  3. 我怎样才能正常暂停它，使它只能通过下一个和上一个点击工作？谢谢你
4

1 回答 1

0

http://jsfiddle.net/isherwood/VCwPE/6

$('#myCarousel').carousel({
    interval: false;   
})
  1. By using the standard markup the buttons are positioned correctly. You could apply different left/right positions to move them, like I did in this fiddle.
  2. See above.
  3. Use interval: false

Bungus makes some good points (answer has been removed). I think you're better off using the least markup and letting your carousel be responsive, as the Bootstrap team intended.

于 2013-06-25T14:06:12.413 回答