thinkphp標(biāo)簽實(shí)現(xiàn)bootsrtap輪播carousel實(shí)例代碼
由于輪播carousel第一個(gè)div需要設(shè)置active樣式才能正常顯示,上面的圓點(diǎn)也同樣需要數(shù)字,
使用volist標(biāo)簽在循環(huán)的同時(shí)可以取得下標(biāo)(foreach,for標(biāo)簽實(shí)現(xiàn)不了)
<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>
以上所述是小編給大家介紹的thinkphp標(biāo)簽實(shí)現(xiàn)bootsrtap輪播carousel實(shí)例代碼,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
關(guān)于TypeScript中import JSON的正確姿勢詳解
2012年10月首度對外公布typescript(當(dāng)時(shí)已經(jīng)是0.7?的版本)同時(shí)開源,ts的編譯器是用js編寫的(后來改成ts?),可以在線編寫。下面這篇文章主要給大家介紹了關(guān)于TypeScript中import JSON的正確姿勢,需要的朋友可以參考下。2017-07-07
javascript運(yùn)行機(jī)制之執(zhí)行順序理解
這篇文章主要介紹了javascript運(yùn)行機(jī)制之執(zhí)行順序理解,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08
javascript實(shí)現(xiàn)獲取服務(wù)器時(shí)間
本文給大家總結(jié)了一下使用javascript來獲取服務(wù)器時(shí)間的幾種方法和思路,十分的簡單明了,有需要的小伙伴可以參考下2015-05-05
12個(gè)提高JavaScript技能的概念(小結(jié))
這篇文章主要介紹了12個(gè)提高JavaScript技能的概念(小結(jié)),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-05-05
ajax如何實(shí)現(xiàn)頁面局部跳轉(zhuǎn)與結(jié)果返回
AJAX即“Asynchronous Javascript And XML”(異步JavaScript和XML),是指一種創(chuàng)建交互式網(wǎng)頁應(yīng)用的網(wǎng)頁開發(fā)技術(shù),通過在后臺與服務(wù)器進(jìn)行少量數(shù)據(jù)交換,AJAX 可以使網(wǎng)頁實(shí)現(xiàn)異步更新,本篇文章給大家介紹ajax如何實(shí)現(xiàn)頁面局部跳轉(zhuǎn)與結(jié)果返回,感興趣的朋友一起來學(xué)習(xí)2015-08-08
JavaScript 中獲取數(shù)組最后一個(gè)元素方法匯總
在JavaScript中,獲取數(shù)組最后一個(gè)元素的方法有很多種。今天我們就來匯總一下JavaScript獲取數(shù)組最后一個(gè)元素的幾種方法,需要的朋友可以參考下2023-02-02

