觸發(fā)輪播圖的播放方法也有兩種，一種是聲明式，另外一種是JavaScript方式。首先來(lái)看聲明式方法。

聲明式方法是通過(guò)定義 data 屬性來(lái)實(shí)現(xiàn)，data 屬性可以很容易地控制輪播的位置。其主要包括以下幾種：

• data-ride 屬性：取值 carousel，并且將其定義在 carousel 上。
• data-target 屬性：取值 carousel 定義的 ID 名或者其他樣式識(shí)別符，如前面示例所示，取值為“#slidershow”，并且將其定義在輪播圖計(jì)數(shù)器的每個(gè) li 上。
• data-slide 屬性：取值包括 prev，next，prev表示向后滾動(dòng)，next 表示向前滾動(dòng)。該屬性值同樣定義在輪播圖控制器的 a 鏈接上，同時(shí)設(shè)置控制器 href 值為容器 carousel 的 ID 名或其他樣式識(shí)別符。
• data-slide-to 屬性：用來(lái)傳遞某個(gè)幀的下標(biāo)，比如 data-slide-to="2"，可以直接跳轉(zhuǎn)到這個(gè)指定的幀（下標(biāo)從0開(kāi)始計(jì)），同樣定義在輪播圖計(jì)數(shù)器的每個(gè) li 上。

基于上例，設(shè)置了自定義的 data 屬性之后如下：

<div id="slidershow" class="carousel" data-ride="carousel">
<!-- 設(shè)置圖片輪播的順序 -->
    <ol class="carousel-indicators">
        <li class="active" data-target="#slidershow" data-slide-to="0"></li>
        <li data-target="#slidershow" data-slide-to="1"></li>
        <li data-target="#slidershow" data-slide-to="2"></li>
        <li data-target="#slidershow" data-slide-to="3"></li>
        <li data-target="#slidershow" data-slide-to="4"></li>
        <li data-target="#slidershow" data-slide-to="5"></li>
    </ol>
    <!-- 設(shè)置輪播圖片 -->
    <div class="carousel-inner">
    …
    </div>
    <!-- 設(shè)置輪播圖片控制器 -->
    <a class="left carousel-control" href="#slidershow" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
    </a>
    <a class="right carousel-control" href="#slidershow" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
    </a>
</div>

在這里需要注意可以為 #slidershow 層添加 slide 樣式，使用圖片與圖片切換效果有平滑感。

<div id="slidershow" class="carousel slide" data-ride="carousel">
  ...
</div>

這樣頁(yè)面一加載就會(huì)有輪播效果了且單擊向前向后按鈕也可以切換圖片了：