thinkphp標(biāo)簽實(shí)現(xiàn)bootsrtap輪播carousel實(shí)例代碼

更新時(shí)間：2017年02月19日 10:57:47 作者：QTFYING

這篇文章給大家介紹thinkphp標(biāo)簽實(shí)現(xiàn)bootsrtap輪播carousel實(shí)例代碼，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的的朋友參考下

由于輪播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í)例代碼，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

相關(guān)文章

詳解JS內(nèi)存空間
因?yàn)镴avaScript具有自動(dòng)垃圾回收機(jī)制，所以對(duì)于前端開發(fā)來說，內(nèi)存空間并不是一個(gè)經(jīng)常被提及的概念。特別是很多不是計(jì)算機(jī)專業(yè)的朋友在進(jìn)入到前端之后，會(huì)對(duì)內(nèi)存空間的認(rèn)知比較模糊，甚至有些人干脆就是一無所知。為了解決大家的疑惑，本文將詳細(xì)介紹JS內(nèi)存空間
2021-06-06
JavaScript的遞歸之遞歸與循環(huán)示例介紹
對(duì)于不同類型的需要重復(fù)計(jì)算的問題，循環(huán)和遞歸兩種方法各有所長，能給出更直觀簡單的方案，下面為大家詳細(xì)的介紹下JavaScript的遞歸與循環(huán)，感興趣的朋友可以了解下
2013-08-08
js點(diǎn)擊頁面其它地方將某個(gè)顯示的DIV隱藏
今天一朋友問我點(diǎn)擊一按鈕彈出一個(gè)DIV，然后要求點(diǎn)擊頁面其它地方隱藏這個(gè)DIV
2012-07-07
JS文本獲得焦點(diǎn)清除文本文字的示例代碼
本篇文章主要是對(duì)JS文本獲得焦點(diǎn)清除文本文字的示例代碼進(jìn)行介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2014-01-01
基于JavaScript實(shí)現(xiàn)交互式博客
在Web開發(fā)中,JavaScript（JS）是一種至關(guān)重要的編程語言,它使網(wǎng)頁具有交互性,本文主要介紹了如何使用JavaScript實(shí)現(xiàn)一個(gè)交互式博客,需要的可以了解下
2024-01-01
javascript中的事件代理初探
本文僅僅起到一個(gè)拋磚引玉的作用，讓大家了解到事件代理的原理而已，jquery中的live和delegate實(shí)現(xiàn)要復(fù)雜的多
2014-03-03
LazyLoad 延遲加載(按需加載)
大型網(wǎng)站往往很矛盾，想用戶在首頁看到更多東西，又不想浪費(fèi)太多服務(wù)器流量。比如一個(gè)有3屏的首頁?？赡?0%的用戶進(jìn)首頁的目的是點(diǎn)擊首頁的連接，到子頁面。
2010-05-05
JS一維數(shù)組轉(zhuǎn)化為三維數(shù)組方法
這篇文章主要給大家分享了JS一維數(shù)組轉(zhuǎn)化為三維數(shù)組的方法，下面文章圍繞JS數(shù)組轉(zhuǎn)換的相關(guān)資料展開內(nèi)容，對(duì)大家的學(xué)習(xí)有一定的參考價(jià)值，需要的小伙伴可以參考一下
2022-01-01
JavaScript類數(shù)組對(duì)象轉(zhuǎn)換為數(shù)組對(duì)象的方法實(shí)例分析
這篇文章主要介紹了JavaScript類數(shù)組對(duì)象轉(zhuǎn)換為數(shù)組對(duì)象的方法,結(jié)合實(shí)例形式分析了javascript類數(shù)組對(duì)象的功能,以及類數(shù)組對(duì)象轉(zhuǎn)換為數(shù)組對(duì)象的相關(guān)方法與實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-07-07
JS實(shí)現(xiàn)從連接中獲取youtube的key實(shí)例
這篇文章主要介紹了JS實(shí)現(xiàn)從連接中獲取youtube的key的方法,涉及javascript字符串操作的相關(guān)技巧,需要的朋友可以參考下
2015-07-07