2017-06-12 146 views
0

我在我的網站的一個頁面上有多個輪播和這一個我無法去工作。右側和左側按鈕不會更改幻燈片,我無法弄清楚原因。Bootstrap旋轉木馬箭頭不改變幻燈片

這裏是一個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"> 

回答

0

鏈接當您在它工作的最後一個腳本添加結束腳本標籤。

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 

fiddle

+0

良好的漁獲!我錯過了結束標籤。當它只是旋轉木馬時,它確實有用,但在我的網站上它不起作用。我正在嘗試修復的頁面上有2個輪播。他們都有一個data-ride =「carousel」。這可能是什麼混亂嗎? – Abbey

+0

http://nebraskaonehealth.unl.edu/index-new.asp – Abbey

相關問題