我的网站的一页上有多个轮播,而这一轮我上班了。左右按钮不会改变幻灯片,我也不知道为什么。
这是指向Codepen https://codepen.io/aahmed2/pen/PjzwaQ的链接
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<div id="news-carousel" class="carousel slide" data-ride="carousel">
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<div class="carousel-caption">
<h2 class="white shadow">In The News:</h2>
<h3 class="white shadow">The Global Gap In Health Care Dollars For Young And Old Is Huge</h3>
<a class="button-rev button-left" href="http://www.npr.org/sections/goatsandsoda/2017/05/09/527453473/old-people-get-very-little-health-care-in-the-developing-world" target="_blank">Learn More</a>
</div>
</div>
<div class="item">
<div class="carousel-caption">
<h2 class="white shadow">In The News:</h2>
<h3 class="white shadow">Can Saving Animals Prevent the Next Deadly Pandemic?</h3>
<a class="button-rev button-left" href="http://www.smithsonianmag.com/science-nature/can-saving-animals-to-prevent-next-deadly-pandemic-180963151/" target="_blank">Learn More</a>
</div>
</div>
<div class="item">
<div class="carousel-caption">
<h2 class="white shadow">In The News:</h2>
<h3 class="white shadow">Coyotes No Match for Wolves’ Hunting Prowess</h3>
<a class="button-rev button-left" href="http://news.unl.edu/newsrooms/today/article/big-game-jitters-coyotes-no-match-for-wolves-hunting-prowess/" target="_blank">Learn More</a>
</div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#news-carousel" 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="#news-carousel" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js">
最佳答案
当您在最后一个脚本上添加结束脚本标记时,它将起作用。
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
见fiddle