html - 为什么我不能在模态窗口中使用滑动图片

Question

我有一个按钮，当我点击他时，我创建了一个打开模态窗口的按钮。在模态窗口中我创建了旋转木马 slider ，我在人字形左右滑动时遇到问题，那是行不通的，在我的计算机上图像滑动了 5 秒，但是在 jsfiddle 上滑动不起作用，你能告诉我在人字形上滑动有什么问题吗左和右。在我的大元素中，我有 2 个 slider ，当我在模式窗口中单击人字形时，我的页面向下滚动

JSFIDDLE http://jsfiddle.net/3kgbG/802/

HTML

  <button class="btn btn-lg btn-block" data-toggle="modal" data-target=".bs-example-modal-lg">CLICK HERE</button>
<div 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">
       <divclass="carousel slide" data-ride="carousel">
                    <div class="carousel-inner">
                        <div class="item active">
                            <img src="http://cdn.banquenationale.ca/cdnbnc/2013/06/ruisseau.jpg">
                        </div>

                        <div class="item">
                           <img src="http://pixdaus.com/files/items/pics/4/68/127468_81126581de22e05a9a66d3216ae2b4ad_large.jpg">
                        </div>

                        <div class="item">
                            <img src="http://www.naturehighlights.com/images/25.1_Canada.jpg">
                        </div>
                    </div>

                    <a class="left carousel-control" href="#locations" data-slide="prev">
                        <span class="glyphicon glyphicon-chevron-left"></span>
                    </a>
                    <a class="right carousel-control" href="#locations" data-slide="next">
                        <span class="glyphicon glyphicon-chevron-right"></span>
                    </a>

                </div>
        </div>
    </div>
</div>

Answer 1

您忘记了 Carousel 的 id，并且将 class 属性与 div 标签混在一起。

<div id="locations" class="carousel slide" data-ride="carousel">

Updated Fiddle link

<a class="left carousel-control" data-target="#locations" data-slide="prev">
     &lsaquo;
     <span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" data-target="#locations" data-slide="next">
     &rsaquo;
     <span class="glyphicon glyphicon-chevron-right"></span>
</a>