Bootstrap Carousel控件不起作用

Question

twitter bootstrap輪播無法正常工作。 我嘗試將ID（'#mycarousel'）更改為.carousel或.mycarousel，但沒有任何效果。 當我單擊控件時，它不會前進。 這段代碼有什么問題？

<html>
<head>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js></script>
<script type="text/javascript">
function(){
    $('#mycarousel').carousel();
}
</script>
</head>

<body>
<div class="container">
<div class="row">

<div class="span12 well">
<div id="mycarousel" class="carousel slide span8">
<div class="carousel-inner">
    <div class="item active"><img src="car1.jpg"></div>
    <div class="item"><img src="car2.jpg"></div>
    <div class="item"><img src="car3.jpg"></div>
    <div class="item"><img src="car4.png"></div>
    <div class="item"><img src="car5.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="js/carousel.js"></script>
<script src="js/bootstrap-transition.js"></script>
<script src="js/bootstrap.js"></script>
</body>
</html>

Answer 1

以下代碼將永遠不會執行，因為您從未真正調用它。

$('#mycarousel').carousel();

您應該更改以下內容：

function(){
    $('#mycarousel').carousel();
}

至：

$(function(){
    $('#mycarousel').carousel();
});

當dom准備就緒時，這將使其執行。

您也不會關閉鏈接標簽，該鏈接標簽會從加載中加載引導CSS。

<link rel="stylesheet" type="text/css" href="css/bootstrap.css"

應該：

<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />

您按不確定的順序加載JS文件。 我想它們應該是相反的順序。

Bootstrap Carousel控件不起作用

問題描述

1 個解決方案

解決方案1
3 已采納 2013-07-10 17:18:09

Bootstrap Carousel控件不起作用

問題描述

1 個解決方案

解決方案1 3 已采納 2013-07-10 17:18:09

解決方案1
3 已采納 2013-07-10 17:18:09