ブートストラップカルーセルを開始できません、ええと、カルーセルです。以下は、私がやろうとしていることに関係するすべてのコードです。ブラウザでレンダリングすると、2つの画像が上下に表示され、その下にある画像よりも小さい画像と大きい画像だけが表示されます。カルーセルでレンダリングするのではなく、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">‹</a>
<a class="carousel-control right" href="#carousel" data-slide="next">›</a>
</div>
</body>
</html>