0

我曾尝试在引导程序中进行轮播，但它无法在 Windows 8 中的 Firefox 或 Google chrome 上加载。这是我编写的代码，所以有人可以向我解释我做错了什么。

<html>
<body>
 <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>
        <div class="carousel-inner">
            <div class="item">
                <img src="img/Capture.PNG" />
            <div class="item">
                <img src="img/img1.PNG" />
            <div class="item">
                <img src="img/img3.PNG" />
        </div>
        <a class="left carousel-control"  href="#mycarousel"  data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
        </a>
        <a class="right carousel-control"  href="#mycarousel" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
        </a>
    </div>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/bootstrap.js"></script>
</body>

</html>
4

3 回答 3

3

您应该在 bootstrap3 中包含 carousel.js 并关闭您的div item

于 2013-10-16T13:20:06.930 回答
0

关闭您的 div“项目”标签，然后将第一个“项目”设置为“活动”

    <div class="carousel-inner">
            <div class="active item">
                <img src="Capture.PNG" />
            </div>
            <div class="item">
                <img src="img1.PNG" />
            </div>
            <div class="item">
                <img src="img3.PNG" />
            </div>
        </div>

然后最重要的是不要忘记加载“bootstrap.css” => http://getbootstrap.com/2.3.2/assets/css/bootstrap.css。因为 bootsrap 使用了那个 css 文件。

于 2013-12-24T10:11:21.740 回答
0

请在您的 html 文档中包含 carousel.js

参考下载carousel.js： http: //getbootstrap.com/javascript/#carousel

于 2013-10-16T13:22:08.833 回答