9
Tôi đang chuyển đổi một ứng dụng sang Bootstrap 3. Đây là mã cho trang băng chuyền mẫu của tôi, toàn bộ. Có, tôi đã tải jQuery trước khi Bootstrap.js được tải. Vì lý do gì đó, băng chuyền đơn giản sẽ không hoạt động. Cụ thể: các nút trước/tiếp theo không hoạt động và băng chuyền không tự động trượt sang trang trình bày tiếp theo.Bootstrap 3 Carousel sẽ không hoạt động. (Có, tôi đã tải jQuery trước khi Bootstrap)
Tested chống lại:
- Safari 6.0.5
- Chrome 28.0.1500.95
- Firefox 23,0
... trên Mac OS X 10.8.4
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--[if lt IE 9]>
<script src="" alt-src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script src="http://code.jquery.com/jquery.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-glyphicons.css" type="text/css">
<title>Carousel Test</title>
<meta name="description" content="">
<meta name="keywords" content="">
<script>
// Added this just so I didn't have to wait 5 seconds to see if the transition worked. //
$(document).ready(function() {
$('#Carousel').carousel({
interval: 1000
});
});
</script>
</head>
<body>
<div id="Carousel" class="carousel slide">
<ol class="carousel-indicators">
<li data-target="Carousel" data-slide-to="0" class="active"></li>
<li data-target="Carousel" data-slide-to="1"></li>
<li data-target="Carousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img src="img/Carousel/001.jpg">
</div>
</div>
<div class="carousel-inner">
<div class="item">
<img src="img/Carousel/002.jpg">
</div>
</div>
<div class="carousel-inner">
<div class="item">
<img src="img/Carousel/003.jpg">
</div>
</div>
<a class="left carousel-control" href="#Carousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#Carousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</body>
</html>
Bất cứ ai có một cái nhìn sâu sắc về lý do tại sao điều này không hoạt động?
Bảng điều khiển của bạn có cung cấp cho bạn bất kỳ lỗi nào không? –
Không tải trang ... và không phải khi tôi nhấp vào các nút trước đó và tiếp theo. Khi tôi nhấp vào các chỉ báo băng chuyền, tôi nhận được "TypeError: 'null' không phải là một đối tượng (đánh giá 'e.data (" bs.carousel "). Tới')" trên bootstrap.min.js, dòng 6. –
Cảm ơn bạn đã đặt câu hỏi này. Vấn đề tôi đã không tải jquery ;-) – whitehat