【问题标题】:Bootstrap Carousel Only loads one pictureBootstrap Carousel 只加载一张图片
【发布时间】:2015-12-30 21:47:33
【问题描述】:

我开始我的第一个项目并尝试合并一个轮播,但由于某种原因,轮播不会加载其他图片,当我尝试单击底部的圆圈查看其他图片时,它只停留在第一张。我按照发球台的说明进行了检查,看了一会儿,但似乎仍然无法正常工作

<!DOCTYPE html>
<html lang="en">
  <head>
     <title>Agapé Dance Company ∞</title>
     <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">
  </head>

  <body>


<!--Carousel section -->
            <div id="#myCarousel" class="carousel">
                <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>
                <div class="carousel-inner">
                    <div class="item active">
                        <img src="images/1.jpg" alt="agape performing" class="img-responsive">
                    </div>  
                    <div class="item">
                        <img src="images/2.jpg" alt="agape performing" class="img-responsive">
                    </div>  
                    <div class="item">
                        <img src="images/3.jpg" alt="agape performing" class="img-responsive">
                    </div>  
                </div>  
            </div>          

    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>

  </body>
</html>

【问题讨论】:

  • 你能检查你的控制台看看是否有任何错误吗?

标签: jquery html css twitter-bootstrap carousel


【解决方案1】:

你忘记了什么。我将属性 data-ride="carousel" 和类幻灯片添加到

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

滑块开始工作。

【讨论】:

    猜你喜欢
    • 2015-07-26
    • 1970-01-01
    • 2013-12-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-04-14
    • 2017-09-27
    相关资源
    最近更新 更多