cara membuat efek pelangi pada link blog

Tweet

hay sobat Putupunyablog ? kali ini saya akan memposting tentang cara membuat link menjadi pelangi saat mouse pointer diarahkan ke link blog sobat. yang dimaksud cara diatas adalah jika mouse pointer diarahkan ke link blog kita, maka terjadi efek berwarna warni, paham gak sobat? kalo sobat tidak paham coba sobat lihat di blog saya, saat pointer diarahkna ke link log saya maka akan keluar warna-warni berseri. hehe cantik tak sobat :) ?. istilahnya ada efek pelanginya lah :). baik, berikut ini cara memasang efek pelangi pada link yaitu sebagai berikut :

1. masuk ke akun blogger sobat
2. klik Rancangan > Edit HTML , jangan lupa lho sobat klik centang pada Expand Template Widget
3. kemudian cari kode </head> 
4. jika sudah ketemu kodenya, letakkan kode berikut tepat pas dibawah kode </head> .

<script type='text/javascript'>
//<![CDATA[
var rate = 20;
if (document.getElementById)
window.onerror=new Function("return true")
var objActive; // The object which event occured in
var act = 0; // Flag during the action
var elmH = 0; // Hue
var elmS = 128; // Saturation
var elmV = 255; // Value
var clrOrg; // A color before the change
var TimerID; // Timer ID
if (document.all) {
document.onmouseover = doRainbowAnchor;
document.onmouseout = stopRainbowAnchor;
}
else if (document.getElementById) {
document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
document.onmouseover = Mozilla_doRainbowAnchor;
document.onmouseout = Mozilla_stopRainbowAnchor;
}
function doRainbow(obj)
{
if (act == 0) {
act = 1;
if (obj)
objActive = obj;
else
objActive = event.srcElement;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
function stopRainbow()
{
if (act) {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
function doRainbowAnchor()
{
if (act == 0) {
var obj = event.srcElement;
while (obj.tagName != 'A' && obj.tagName != 'BODY') {
obj = obj.parentElement;
if (obj.tagName == 'A' || obj.tagName == 'BODY')
break;
}
if (obj.tagName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = objActive.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}
function stopRainbowAnchor()
{
if (act) {
if (objActive.tagName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
function Mozilla_doRainbowAnchor(e)
{
if (act == 0) {
obj = e.target;
while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
obj = obj.parentNode;
if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
break;
}
if (obj.nodeName == 'A' && obj.href != '') {
objActive = obj;
act = 1;
clrOrg = obj.style.color;
TimerID = setInterval("ChangeColor()",100);
}
}
}
function Mozilla_stopRainbowAnchor(e)
{
if (act) {
if (objActive.nodeName == 'A') {
objActive.style.color = clrOrg;
clearInterval(TimerID);
act = 0;
}
}
}
function ChangeColor()
{
objActive.style.color = makeColor();
}
function makeColor()
{
// Don't you think Color Gamut to look like Rainbow?
// HSVtoRGB
if (elmS == 0) {
elmR = elmV; elmG = elmV; elmB = elmV;
}
else {
t1 = elmV;
t2 = (255 - elmS) * elmV / 255;
t3 = elmH % 60;
t3 = (t1 - t2) * t3 / 60;
if (elmH < 60) {
elmR = t1; elmB = t2; elmG = t2 + t3;
}
else if (elmH < 120) {
elmG = t1; elmB = t2; elmR = t1 - t3;
}
else if (elmH < 180) {
elmG = t1; elmR = t2; elmB = t2 + t3;
}
else if (elmH < 240) {
elmB = t1; elmR = t2; elmG = t1 - t3;
}
else if (elmH < 300) {
elmB = t1; elmG = t2; elmR = t2 + t3;
}
else if (elmH < 360) {
elmR = t1; elmG = t2; elmB = t1 - t3;
}
else {
elmR = 0; elmG = 0; elmB = 0;
}
}
elmR = Math.floor(elmR).toString(16);
elmG = Math.floor(elmG).toString(16);
elmB = Math.floor(elmB).toString(16);
if (elmR.length == 1) elmR = "0" + elmR;
if (elmG.length == 1) elmG = "0" + elmG;
if (elmB.length == 1) elmB = "0" + elmB;
elmH = elmH + rate;
if (elmH >= 360)
elmH = 0;
return '#' + elmR + elmG + elmB;
}
//]]>
</script>

oiya, sobat juga bisa pake HTML/JavaScript

caranya : Rancangan > Tata Letak > Tambah Gadget > pilih HTML/JavaScript

paste-kan kode berikut ke kolo konten .

<script src='http://sabarmuanas.googlecode.com/files/infonetmu.blogspot.com.mousepelangi.js' type='text/javascript'>
</script>

klik Simpan , dan coba lihat hasilnya, jadi cantik bukan sobat ? . efek ini tidak mengganggu loading blog sobat lho, jadi tenang aja sobat, gak bakalan berat, enteng kayak kapas :) . selamat mencoba .

jangan lupa tanggapannya sobat

Related articles, courtesy of Zemanta:

• Kami Dari Semua : ShoutBox on WordPress with 99SHOUTBOX - a Simple Installation Guide from a Dummies

Baca Juga Artikel Dibawah Ini!