Question

我正在使用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>

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

Answer 1

在加价结束时你还有一个额外的结束</div>。

在关联type="text/javascript"文件时，请不要忘记在bootstrap.js周围添加引号。如果您有HTML 5文档类型，则不需要type属性.. < / p>

您还错误地引用了图片：

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

Bootstrap Carousel未加载

1 个答案: