0

我正在使用 Twitter Bootstrap 框架来创建一个轮播，但我没有任何成功。这是我的脚本/CSS 声明：

    <link href ="css/bootstrap.css" rel="stylesheet">
    <link href="css/main.css" rel="stylesheet">
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="scripts/bootstrap.js" type=text/javascript></script>
    <script>
        $(document).ready(function(){
            $('.carousel').carousel();
        });
    </script>

这是我适用的轮播标记：

    <div class="carousel-container">
            <div id="carousel-main" class="carousel slide">
                <div class="carousel-inner">
                    <div class="item active"><img src="slide1.jpg" /></div>
                    <div class="item"><img src="slide2.jpg /"> </div>
                    <div class="item"><img src="slide3.jpg /"> </div>
                </div>
                <a class="carousel-control left" href="carousel-main"
                    data-slide="prev">&lsaquo</a>
                <a class="carousel-control right" href="carousel-main"
                    data-slide="next">&rsaquo</a>
            </div>
        </div>
    </div>

当我加载页面时，除了我的轮播之外的所有内容都会出现。我哪里错了？

4

1 回答 1

2

</div>您在标记结束时有一个额外的关闭..

也不要忘记type="text/javascript"在链接bootstrap.js文件时在 .. 周围添加引号。如果您有 HTML 5 文档类型，type则不需要该属性..

您还错误地引用了您的图像：

编辑：而不是：<img src="slide3.jpg /">使用：<img src="slide3.jpg" />

于 2013-02-25T19:30:30.377 回答