|
目前,大家的博客左側(cè)通常加上一個漂亮的多彩標(biāo)記,也想給自己的小站加一下這個小功能。
可惜已經(jīng)再不再是使用WordPress的時候那么方便了,使用WordPress的朋友們直接使用現(xiàn)成的插件,鼠標(biāo)點點就可以加上這個炫彩的功能。小站程序是自個寫的,要加這么一個功能還是得自己動手,就當(dāng)學(xué)習(xí)吧!
首先,我分析了一下目前多彩標(biāo)簽的主要表現(xiàn)形式,主要有兩點:顏色多樣,大小不一。這個是多彩標(biāo)簽的特性,于是想到了php中的隨機函數(shù)rand。直接給大小,顏色用rand隨機取值就可以。
大小的隨機值容易搞定,直接生成后連接單位即可
復(fù)制代碼 代碼如下:
<?php
// 隨機大小實例
$m = rand(20,30);
echo '<span style="font-size:'.$m.'px">隨機大小</span>';
?>
生成顏色值稍微麻煩一些,因為顏色值是十六進(jìn)制字符表現(xiàn)形式,而隨機函數(shù)rand不能直接生成 0 到 F 這么用,最后直接用數(shù)組保存十六進(jìn)制字符,然后隨機生成鼠標(biāo)下標(biāo)這樣也可以實現(xiàn)隨機顏色
復(fù)制代碼 代碼如下:
<?php
// 隨機顏色函數(shù)
// 直接返回隨機生成的色值
function getColor(){
// 先用數(shù)組把十六進(jìn)制字符保存在一個數(shù)組中
$arr = array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F');
// 因為顏色色值長度是6位,所以循環(huán)6次
for($i=0;$i<6;$i++){
// 隨機生成0到15數(shù)字,然后當(dāng)作數(shù)組下標(biāo)取值即可
$color .= $arr[rand(0,15)];
}
// 返回的時候,把#號加上
return ‘#'.$color;
}
?>
隨機大小,隨機顏色搞定后剩下的都不是問題的問題了。直接取出所有標(biāo)簽然后去重,然后遍歷數(shù)組生成HTML文本即可。
最后提點建議,畢竟php是服務(wù)器端,每次都rand會讓服務(wù)器鴨梨不?。切┨嘏5臋C器可以忽略不計,畢竟目前用VPS的還是眾多)。我們可以在博客的標(biāo)簽在發(fā)生變動的時候再生成即可,比如刪除,修改,增加文章產(chǎn)生新的標(biāo)簽時候我們再去生成多彩標(biāo)簽的HTML文本。最后這些生成的多彩簽HTML沒必要存進(jìn)數(shù)據(jù)庫,直接保存在在一個文件里,然后include即可。
目前,我的小站就是這么實現(xiàn)的。有空,我再介紹JavaScript實現(xiàn)多彩標(biāo)簽,原理也差不多一樣,只不過是JavaScript是客戶端行為,不用擔(dān)心服務(wù)器端的鴨梨,而且JavaScript交互性比較好,可以制作出具有動畫效果的云標(biāo)簽。
php技術(shù):PHP實現(xiàn)的多彩標(biāo)簽效果代碼分享,轉(zhuǎn)載需保留來源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請第一時間聯(lián)系我們修改或刪除,多謝。