Make Link Effect Rainbow Without Hover <small>linkcycle</small>

Efek rainbow/pelangi yang sering kita jumpai ketika melakukan hover pada link, akan berkedip-kedip dan mengeluarkan eferk warna berganti-ganti. Blogger Indonesia banyak juga yg memakai trick ini ;)) RainbowAnchor nama javascriptnya. Bagaimana jadinya jika sekarang kita buat java-script Rainbow Anchor tanpa disorot terlebih dahulu tetapi bisa menampilkan variabel warna dan berkedip-kedip pula di link yg telah kita tagging dengan atribut class :-" Untuk melihat demo silahkan sobat memakai HTML Editor :D (jangan lupa pencet tombol dulu, biar kode yg ada di kotak sebelah kiri musnah) ;) Berikut ramuan javascript linkcycle rainbow anchor.

<script type="text/javascript">
//<![CDATA[
//www.JavaScript-FX.com
function getColor(start,end,percent){function hex2dec(hex){return(parseInt(hex,16));}
function dec2hex (dec){return(dec<16?"0":"")+dec.toString(16);}
var r1=hex2dec(start.slice(0,2)),g1=hex2dec(start.slice(2,4)),b1=hex2dec(start.slice(4,6));var r2=hex2dec(end.slice(0,2)),g2=hex2dec(end.slice(2,4)),b2=hex2dec(end.slice(4,6));var pc=percent/100;var r=Math.floor(r1+(pc*(r2-r1))+.5),g=Math.floor(g1+(pc*(g2-g1))+.5),b=Math.floor(b1+(pc*(b2-b1))+.5);return("#"+dec2hex (r)+dec2hex (g)+dec2hex (b));}
function cycleColor(theClass,start,end,index,speed)
{if(index==0)
{start=end;end=(end+1)%allColors[theClass].length;}
var color=getColor(allColors[theClass][start],allColors[theClass][end],index);for(var i=0;i<document.links.length;i++)
if(document.links[i].className==theClass)
document.links[i].style.color=color;index=(index+speed)%100;setTimeout("cycleColor(\""+theClass+"\","+start+","+end+","+index+","+speed+")",100);}

var allColors = new Array();
allColors["c1"] = new Array("FF00FF", "55FFFF", "5599FF");
allColors["c2"] = new Array("FF0000", "FFFF00", "00FF00");
function JSFX_StartEffects()

{cycleColor("c1",0,0,0,5);cycleColor("c2",0,0,0,10);}
JSFX_StartEffects();
//]]>
</script>

Keterangan:

• Angka 100 pada script.
Mengatur cepat/lambat kedipan.
• "FF00FF", "55FFFF", "5599FF"
Variasi warna, bisa ditambahkan dengan begini "code warna" jangan lupa koma bawahnya!

Markup HTML

Cara pemakaian kalian tinggal membubuhkan atribut class="c1" atau class="c2" Efek c1 & c2 berbeda loh :x
Contoh...<a href="http://embah-google.blogspot.com/" title="embah google" class="c1">Blog Demo Beben Koben</a>

<a href="http://ben-tools.blogspot.com/" title="ben tools" class="c2">Tempat Tools Keren Punya</a>Selamat berkarya :)
Happy blink-blink \m/