Bootstrap Carousel下次或之前没有移动

时间:2013-10-09 18:30:46

标签: twitter-bootstrap

我对Bootstrap很新。我的旋转木马不会向前移动或返回。这是代码:

[代码]

<html>
<head>
    <link rel="Stylesheet" type="text/css" href="css/bootstrap.css" />
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('.carousel').carousel();
        });
    </script>
</head>
<body>
<center>
<div class="container">
<div class="row">
<div class="span6 well">
<div id="myCarousel" class="carousel">
<div class="carousel-inner">
<div class="item"><img src="1.jpg"></div>
<div class="item active"><img src="2.jpg"></div>
<div class="item"><img src="3.jpg"></div>
<div class="item"><img src="4.jpg"></div>
</div>
<a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
</div>
</div>
</div>
</div>
<script src="carousel.js"></script>
</center>
</body>
</html>

有人可以告诉我我做错了吗?

感谢任何/所有帮助。

2 个答案:

答案 0 :(得分:2)

确保按顺序添加此(.js)并指向您放入的文件夹:

1- jquery library

2-js for bootstrap 3

3-您的旋转木马js

示例:

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="bootstrap.min.js"></script>
<script src="carousel.js"></script>

希望这会对你有所帮助

答案 1 :(得分:0)

测试

<script src="carousel.js"></script>

 <div id="myCarousel" class="carousel slide" >

        <!-- Wrapper for slides -->
        <div class="carousel-inner">
   <div class="item"><img src="1.jpg"></div>
<div class="item active"><img src="2.jpg"></div>
<div class="item"><img src="3.jpg"></div>
<div class="item"><img src="4.jpg"></div>
        </div>
       <!-- Controls-->
  <a class="left carousel-control" href="#myCarousel" data-slide="prev">
    <span class="icon-prev"></span>
  </a>
  <a class="right carousel-control" href="#myCarousel" data-slide="next">
    <span class="icon-next"></span>
  </a> 
      </div>
      <!-- /.carousel -->

  <script>
$('#myCarousel').carousel
({
    interval: 2000,


    })

</script>