图片自动轮播
Posted niechuang
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了图片自动轮播相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-2.1.4.js"></script>
<link href="css/bootstrap.css" rel="stylesheet">
<script src="js/jquery-2.1.4.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
<body style="padding:100px">
<div class="carousel slide" data-inteval="6666" data-ride="carousel" data-toggle="carousel" id="page" style="width:553px">
<div class="carousel-inner">
<div class="item active"><img src="风景/322135.jpg"></div>
<div class="item"><img src="风景/219014.jpg"></div>
<div class="item"><img src="风景/321429.jpg"></div>
<div class="item"><img src="风景/319968.jpg"></div>
<div class="item"><img src="风景/321568.jpg"></div>
<div class="item"><img src="风景/322050.jpg"></div>
</div>
<a href="#page" class="carousel-control left" data-slide="prev"></a>
<a href="#page" class="carousel-control right" data-slide="next"></a>
<ul class="carousel-indicators">
<li data-target="#page" data-slide-to="0" class="actove"></li>
<li data-target="#page" data-slide-to="1"></li>
<li data-target="#page" data-slide-to="2"></li>
<li data-target="#page" data-slide-to="3"></li>
<li data-target="#page" data-slide-to="4"></li>
<li data-target="#page" data-slide-to="5"></li>
</ul>
</div>
</body>
</html>
以上是关于图片自动轮播的主要内容,如果未能解决你的问题,请参考以下文章