網(wǎng)頁內(nèi)容既多又雜，不知道該如何排版整理，直接鋪開來放在網(wǎng)頁上又怕沒人看？
如果你正面臨著這樣的問題，那么只能說明一件事，那就是你不知道如何使用竹子編輯器里面的Tab組件！
Tab組件可以將內(nèi)容進(jìn)行分類，可以在只占據(jù)網(wǎng)頁較小一部分縱向空間的情況下，展示很多的信息內(nèi)容，它的畫風(fēng)是這樣子的：
而本次我們的功能更新就是針對Tab組件進(jìn)行的，我們優(yōu)化新增了兩個tab組件的功能，現(xiàn)在它可以適用的場景就更加多樣啦！
從前我們的tab組件切換tab項(xiàng)時都是需要點(diǎn)擊進(jìn)行切換的，現(xiàn)在支持鼠標(biāo)移入激活來進(jìn)行切換啦！
設(shè)置方式也很簡單，我們點(diǎn)擊tab組件，依次選擇：設(shè)置——交互——子項(xiàng)激活方式——hover激活，點(diǎn)擊保存即可。
這樣設(shè)置完成以后，我們點(diǎn)擊發(fā)布網(wǎng)站，將現(xiàn)在的修改同步到實(shí)際網(wǎng)頁中去，那邊實(shí)際網(wǎng)頁中的效果就會是這樣的：
二、導(dǎo)航設(shè)置進(jìn)行tab子項(xiàng)的跳轉(zhuǎn)
不止一次有客戶反饋希望在導(dǎo)航欄上面設(shè)置鏈接，可以直接跳轉(zhuǎn)到tab組件的一個子項(xiàng)目上面，所以我們對此進(jìn)行了功能更新。
可能字面的描述比較抽象，所以小編就先把網(wǎng)頁的實(shí)際跳轉(zhuǎn)效果先展示給大家看一下：
現(xiàn)在我們導(dǎo)航上設(shè)置的頁面跳轉(zhuǎn)就可以達(dá)到上圖的效果，可以更有效的去利用我們的tab組件來進(jìn)行頁面排版的設(shè)計布局。
而這里的跳轉(zhuǎn)設(shè)置也并不復(fù)雜，首先同樣的我們點(diǎn)擊tab組件，依次選擇：設(shè)置——交互——子項(xiàng)激活方式——路由Hash，點(diǎn)擊保存。
這里設(shè)置完成以后，我們就可以去到導(dǎo)航中設(shè)置相應(yīng)的跳轉(zhuǎn)鏈接，以上圖中這個網(wǎng)站為例，我們的第一個導(dǎo)航中設(shè)置的鏈接為：/16#act-0
鏈接中的/16是指向當(dāng)前頁面的編號，我們可以在編輯器里面找到頁面的編號，如果是首頁沒有這個頁面編號我們可以直接使用/，即鏈接可以設(shè)置為/#act-0
而鏈接中的另一部分，#act-0表示的是激活顯示哪個tab組件的子項(xiàng)分欄，比如現(xiàn)在的#act-0就是顯示第一個tab子項(xiàng)，#act-1則是顯示第二個tab子項(xiàng)，#act-2則是顯示第三個tab子項(xiàng)，以此類推。
然后我們到導(dǎo)航欄中，設(shè)置相應(yīng)導(dǎo)航的跳轉(zhuǎn)網(wǎng)址即可，設(shè)置完成以后不要忘記保存哦！
上述設(shè)置完畢以后，我們就可以點(diǎn)擊編輯器右上角的發(fā)布網(wǎng)站，將對網(wǎng)頁的修改同步到實(shí)際網(wǎng)頁中去了。
好了，以上就是本次我們tab組件更新的全部內(nèi)容了，我們下周再見吧，拜拜！
川公網(wǎng)安備51019002007277號 蜀ICP備17035450號-1