无法让引导程序工作
Trouble getting Bootstrap to work
我正在尝试在我的网站上使用引导轮播,但只显示了第一张图片。按钮上的箭头和切换按钮不会切换到第二张照片或第三张照片。控制台中的错误显示"找不到文件"。
我不确定我错过了什么,这让我发疯。任何帮助将不胜感激,因为我相信这是我错过的快速且相对容易的事情......提前感谢!
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="img/EM1.jpg" class="img-responsive" alt="...">
<div class="carousel-caption"></div>
</div>
<div class="item">
<img src="img/EM2.jpg" alt="...">
<div class="carousel-caption"></div>
</div>
<div class="item">
<img src="img/EM3.jpg" alt="..">
<div class="carousel-caption"></div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span></a>
</div>
这里是引导程序的工作轮播代码 file not found
错误连接时会出现错误。所以你最好再次开始编码,这个片段正在工作,我希望它有所帮助。
h2{
margin: 0;
color: #666;
padding-top: 90px;
font-size: 52px;
font-family: "trebuchet ms", sans-serif;
}
.item{
background: white;
text-align: center;
height: 300px !important;
}
.carousel{
margin-top: 20px;
}
.bs-example{
margin: 20px;
}
.carousel.carousel-fade .item {
opacity:0;
filter: alpha(opacity=0); /* ie fix */
}
.carousel.carousel-fade .active.item {
opacity:1;
filter: alpha(opacity=100); /* ie fix */
}
<head>
<meta charset="UTF-8">
<title>Example of Twitter Bootstrap 3 Carousel</title>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
</head>
<body>
<div class="bs-example">
<div id="myCarousel" class="carousel slide" data-interval="6500" data-ride="carousel">
<!-- Carousel indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Carousel items -->
<div class="carousel-inner">
<div class="active item carousel-fade">
<h2>Slide 1</h2>
<div class="carousel-caption">
<h3>First slide label</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
</div>
<div class="item carousel-fade">
<h2>Slide 2</h2>
<div class="carousel-caption">
<h3>Second slide label</h3>
<p>Aliquam sit amet gravida nibh, facilisis gravida odio.</p>
</div>
</div>
<div class="item carousel-fade">
<h2>Slide 3</h2>
<div class="carousel-caption">
<h3>Third slide label</h3>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur.</p>
</div>
</div>
</div>
<!-- Carousel nav -->
<a class="carousel-control left" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
</div>
</body>
</html>
相关文章:
- 菜单栏class=活动引导程序主题无法正常工作
- 引导程序转盘不工作:堆叠图像(使用rails)
- 引导程序/轨道-可折叠导航栏没有'我不能在手机上工作
- 引导程序's的javascript在本地工作,但在部署到服务器时不能工作
- 使slideUp和slideDown在引导程序导航栏上工作
- Jquery 只为我在第 Asp.net 页上显示的引导程序警报工作一次
- 引导程序 3 模式在放置在固定父级中时无法正常工作
- 导航栏无法正常工作(引导程序 v3)
- 如何让引导选项卡在引导程序 3.3.x 中工作
- 无法让引导程序工作
- 无法使引导程序与 Webpack 一起工作
- 工作列表组引导程序
- 引导程序导航不工作,箭头显示但没有操作
- Twitter引导程序选项卡突然停止工作
- 引导程序3导航选项卡书签url不工作
- 引导程序导航选项卡不工作
- 引导程序导航栏是否可以像引导程序选项卡一样工作
- 可以'无法使Jquery选项卡在Simple Sidebar引导程序模板中工作
- 引导程序.粘贴-jQuery hasClass不工作
- 引导程序旋转木马控件不工作