1

我在 Angular-Seed 项目中添加了 Bootstrap。轮播指示器工作正常,但 Prev/Next 按钮有问题。

单击上一个按钮时,即使您再次单击上一个,它也会切换到最后一个图像并保持在上面。单击“下一步”按钮后,它会切换到第二张图像并停留在上面。

尝试用 CDN 链接替换 ​​JQuery/Bootstrap,但它们的版本不是问题。

这是我正在使用的旋转木马:-

    <div class="container">
      <div id="carouselControls" class="carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
        <li data-target="#carouselControls" data-slide-to="0" class="active"</li>
        <li data-target="#carouselControls" data-slide-to="1"></li>
        <li data-target="#carouselControls" data-slide-to="2"></li>
        <li data-target="#carouselControls" data-slide-to="3"></li>
        <li data-target="#carouselControls" data-slide-to="4"></li>
        </ol>

        <div class="carousel-inner" role="listbox">
            <div class="item active">
                <img class="d-block w-100" src="Main.jpg" alt="">
            </div>
            <div class="item">
                <img class="d-block w-100" src="mainOne.jpg" alt="">
            </div>
            <div class="item">
                <img class="d-block w-100" src="numberFive.jpg" alt="">
            </div>
            <div class="item">
                <img class="d-block w-100" src="numberFour.jpg" alt="">
            </div>
            <div class="item">
                <img class="d-block w-100" src="numberThree.jpg" alt="">
            </div>
        </div>

    <a class="left carousel-control" href="#carouselControls" role="button" data- 
   slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"> 
    </span>
            <span class="sr-only">Previous</span>
        </a>

        <a class="right carousel-control" href="#carouselControls" role="button" 
    data-slide="next">
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"> 
    </span>
            <span class="sr-only">Next</span>
        </a>
      </div>
    </div> 
4

0 回答 0