引导转盘未启动

Bootstrap carousel not initiating

本文关键字:启动      更新时间:2023-11-01

我无法让Bootstrap Carousel启动,嗯,旋转木马。下面是我尝试做的所有代码。当它在浏览器中渲染时,我看到的只是两个图像,一个在另一个上面,一个小于和大于它们下面。它只是按照HTML定义的方式呈现DIV,而不是在旋转木马中呈现。我验证了jQuery.ready函数正在被调用,并且正在调用代码来初始化转盘。我也在IE9、Chrome和Firefox等多种浏览器上尝试过。我没什么主意了。如有任何帮助,我们将不胜感激。谢谢

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <link type="text/css" href="styles/carousel.css" />
    <script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="Scripts/bootstrap-transition.js"></script>
    <script type="text/javascript" src="Scripts/bootstrap-carousel.js"></script>
</head>
<body>
    <script type="text/javascript">
        $(function () {
            $('#carousel').carousel();
        });
    </script>
    <div id="carousel" class="carousel">
      <div class="carousel-inner">
        <div class="item active">
           <img src="images/APM_icon_big.png" alt="Some Alt Text" />
           <div class="carousel-caption">
             Some caption
           </div>
         </div>
        <div class="item">
           <img src="images/appdev_icon_big.png" alt="Some Alt Text" />
           <div class="carousel-caption">
             Some caption
           </div>
         </div>
        …
      </div>
      <a class="carousel-control left" href="#carousel" data-slide="prev">&lsaquo;</a>
       <a class="carousel-control right" href="#carousel" data-slide="next">&rsaquo;</a>
    </div>
</body>
</html>

它似乎在这个小提琴中工作得很好

请确保包含bootstrap为carousel定义的样式:fiddle中包含的css来自twitter bootstrap自定义下载页面,仅选择JS组件carousel

<script>放在<head>中或放在页面末尾可能不会有什么坏处。

我想明白了。我的LINK标签中缺少一个rel="stylesheet"