萬盛學電腦網

 萬盛學電腦網 >> 網絡編程 >> php編程 >> thinkphp標簽實現bootsrtap輪播carousel實例代碼

thinkphp標簽實現bootsrtap輪播carousel實例代碼

本文介紹了thinkphp標簽實現bootsrtap輪播carousel實例代碼,非常實用,有興趣的同學可以參考一下。

由於輪播carousel第一個div需要設置active樣式才能正常顯示,上面的圓點也同樣需要數字,

使用volist標簽在循環的同時可以取得下標(foreach,for標簽實現不了)

 

 代碼如下 復制代碼

<div class="Container">

<!-- carousel -->

<div id="carousel-example-generic"class="carousel slide"data-ride="carousel">

<ol class="carousel-indicators">

<volist name="bopic"id="xt">

<li   data-target="#carousel-example-generic"data-slide-to="{$i-1}"class="<if  condition="$i eq 1">active</if>"></li>

</volist>

</ol>

<div class="carousel-inner">

<volist name="bopic"id="xt">

<div class='item <if condition="$i eq 1 ">active</if>'>

<img src="{$xt.page_bopic_image}"alt="{$xt.page_bopic_seo}"/>

</div>

</volist>

</div>

<a class="left carousel-control"href="#carousel-example-generic"data-slide="prev">

<span class="glyphicon glyphicon-chevron-left"></span>

</a>

<a class="right carousel-control"href="#carousel-example-generic"data-slide="next">

<span class="glyphicon glyphicon-chevron-right"></span>

</a>

</div>

<!-- /.carousel -->

</div>

 

copyright © 萬盛學電腦網 all rights reserved