我正在尝试在网页中插入某种幻灯片，但它只是堆积图像而不起作用。谁能告诉我哪里出错了？
这是代码：
<!DOCTYPE HTML>
<html>
<head>
<title>#</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600' rel='stylesheet' type='text/css'>
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<!--<link rel="stylesheet" href="css/lightbox.css">-->
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/bootstrap-responsive.min.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<style type="text/css">
.carousel-inner img {
width:100%;
}
</style>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<!-- start header -->
<div class="header_bg">
<div class="wrap">
<div class="header">
<div class="logo">
</div>
<div class="h_right">
<br></br><ul class="menu">
<li><a href="index.html" >#</a></li>
<li><a href="Empresa.html">#</a></li>
<li class="active"><a href="destaques.html">#</a></li>
<li><a href="marcas.html">#</a></li>
<li><a href="contactos.html">#</a></li>
<li><a href="login.html">#</a></li>
</ul>
<div id="sb-search" class="sb-search">
<form>
<input class="sb-search-input" placeholder="Enter your search term..." type="text" value="" name="search" id="search">
<input class="sb-search-submit" type="submit" value="">
<span class="sb-icon-search"></span>
</form>
</div>
<script src="js/classie.js"></script>
<script src="js/uisearch.js"></script>
<script>
new UISearch( document.getElementById( 'sb-search' ) );
</script>
<!-- start smart_nav * -->
<nav class="nav">
<ul class="nav-list">
<li class="nav-item"><a href="index.html">#</a></li>
<li class="nav-item"><a href="Empresa.html">#</a></li>
<li class="nav-item"><a href="marcas.html">#</a></li>
<li class="nav-item"><a href="contactos.html">#</a></li>
<div class="clear"></div>
</ul>
</nav>
<script type="text/javascript" src="js/responsive.menu.js"></script>
<!-- end smart_nav * -->
</div>
<div class="clear"></div>
</div>
<div class="header_btm">
<div class="h_left">
<h1><img src="images/manuelazevedoesergiosantoslda.png"></img></a></h1>
</div>
<div class="soc_icons">
<h2></h2>
<br></br><ul>
<li><a href="#"><img src="images/icon4_h.png"/></a></li>
<li><a href="#"><img src="images/icon5_h.png"/></a></li>
<div class="clear"></div>
</ul>
</div>
<div class="clear"></div>
</div>
</div>
</div>
<!-- start main -->
<div class="row-fluid" >
<div id="myCarousel" class="carousel slide">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class=""></li>
<li data-target="#myCarousel" data-slide-to="1" class=""></li>
<li data-target="#myCarousel" data-slide-to="1" class=""></li>
<li data-target="#myCarousel" data-slide-to="2" class="active"></li>
</ol>
<div class="carousel-inner">
<div class="item">
<img src="images/DESTAQUE_Herma.jpg" alt="">
</div>
<div class="item">
<img src="images/DESTAQUE_Primo.jpg" alt="">
</div>
<div class="item">
<img src="images/DESTAQUE_Easy Dò.jpg" alt="">
</div>
<div class="item active">
<img src="images/DESTAQUE_Acryl.jpg" alt="">
</div>
</div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
</div>
<!--End Of Carosuel Slide show-->
</div>
<div class="footer">
<div class="span_of_4">
<div class="span1_of_4">
<h4>Sobre nós</h4>
<p>#</p>
<p></p>
<p></p>
<span></span>
<p class="top"></p>
<p></p>
<p></p>
<p></p>
<p></p>
<div class="f_icons">
<ul>
<li><a class="icon4" href="#"></a></li>
<li><a class="icon5" href="#"></a></li>
</ul>
</div>
</div>
<div class="span1_of_4">
<h4>#</h4>
<p>#</p>
</div>
<div class="span1_of_4">
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fmass.lda&width=600&colorscheme=light&show_faces=true&border_color&stream=true&header=true&height=435" scrolling="yes" style="border:none; overflow:hidden; width:600px; height:360px; background: white; float:left; " allowtransparency="true" frameborder="0"></iframe><br>
</div>
<div class="clear"></div>
</div>
</div>
<div class="footer_top">
<div class="f_nav1">
<ul>
<!--<li><a href="index.html">home</a></li>-->
<!--<li><a href="about.html">about</a></li>-->
<!--<li><a href="marcas.html">marcas</a></li>-->
<li><a href="contactos.html">Politica de Privacidade e de Protecção de dados pessoais da MASS</a></li>
</ul>
</div>
<!--<div class="copy">
</div>-->
<div class="clear"></div>
</div>
<!--script-->
</body>
</html>
我已经尝试过其他一些方法，但这是最接近我必须让它工作......
答案 0 :(得分：0)
可能是因为jquery版本问题，因为Bootstrap轮播不适用于更高版本的jQuery。
我有同样的问题。它可以用最新的bootstrap js修复。
使用
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
它可以解决您的问题。
替换
<div id="myCarousel" class="carousel slide">
与
<div id="myCarousel" class="carousel slide" data-ride="carousel">
和
替换
<div class="carousel-inner">
与
<div class="carousel-inner" role="listbox">
如果这不能解决您的问题，请阅读CAROUSEL ISSUE处的评论，了解更多详情。
修改
答案 1 :(得分：-1)
移动它：
在身体结束标记之前：
<script type="text/javascript" src="js/bootstrap.min.js"></script>