Cara Membuat Efek Pelangi pada Link Blog

Mei

07

Salam sukses selalu buat sobat semua, Belajar Komputer Melalui Internet saat ini akan sedikit membahas tentang Cara Membuat Efek Pelangi pada Link Blog dan semoga artikel ini bermanfaat.

---

Sebelum sobat blogger membaca lebih lanjut tentang Tutorial Blog di Belajar Komputer Melalui Internet, coba sobat blogger menggeser mouse yang sobat pegang, kemudian arahkan cursor sobat pada salah satu link yang ada pada blog Belajar Komputer Melalui Internet ini. What do you see? Apa yang sobat lihat pada link tersebut? Sudah pasti perubahan warna pada Link tersebut. Perubahan warna pada Link tersebut menampilkan warna pelangi Merah, Jingga, Kuning, Hijau, Biru, Nila dan Ungu . Keren kan?

Ada dua kode yang bisa digunakan untuk membuat efek pelangi pada link blog. Berikut ini kode untuk membuat efek Pelangi pada link blog. Silahkan di copy!

• Yang Pertama

<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>  

Kalau kode tersebut sudah di copy, Paste kode tersebut setelah kode </head> Seperti biasa, Tentunya sobat blogger harus login dulu ke akun blogger sobat, setelah itu, sobat klik menu Edit HTML. Lagi satu, Kalau kode tersebut sudah di paste, Simpan template sobat dan lihat hasilnya.

• Yang Kedua

Bagi yang ingin membuat efek pelangi pada ling blog dengan cara yang lebih gampang maka silahkan copy kode javascript berikut dan letakan pada widget blog anda.

<script src=' http://my-project-favicon.googlecode.com/files/efek%20pelangi1.txt' type='text/javascript'>
</script>

Menambahkan Efek pelangi Pada link Blog akan memperindah tampilan blog dan dapat membuat pengunjung blog kagum dengan keunikan-keunikan yang sobat tunjukkan pada blog sobat.

Mungkin sampai disini dulu Belajar Komputer Melalui Internet tentang Cara Membuat Efek Pelangi pada Link Blog kali ini, semoga bermanfaat bagi Anda.

DAPATKAN ARTIKEL VIA EMAIL

Masukan Alamat Email Sobat:

Delivered

BACA JUGA ARTIKEL TERKAIT LAINNYA

Dipublish oleh : Abdul Kohar - Jatinangor Rating 5 Belajar Komputer Melalui Internet, Updated at: 10:47