Kamis, 06 Januari 2011

Membuat teks animasi dengan efek neon light (Neon Lights Text II)

Jika sebelumnya pernah memposting panduan blog tentang efek neon pada teks dimana teks menyala dari kiri ke kanan hingga semua teks akan terlihat menyala. Maka dengan script berikut akan terlihat efek menyala tetap dari kiri ke kanan namun hanya satu karakter saja yang menyala.

Jika tertarik mencoba efek neon pada text ini , silahkan copy script di bawah ini kemudian masukkan ke dalam gadget html/javascript atau ke dalam postingan,
Scriptnya bisa dilihat di bawah ini :



<h2><script language="JavaScript1.2">
//Neon Lights Text II by G.P.F. (gpf@beta-cc.de)
//visit http://www.beta-cc.de
//Visit http://www.dynamicdrive.com for this script

var message="Selamat datang di blog pemula ini!"
var neonbasecolor="gray"
var neontextcolor="yellow"
var neontextcolor2="#FFFFA8"
var flashspeed=100 // speed of flashing in milliseconds
var flashingletters=3 // number of letters flashing in neontextcolor
var flashingletters2=1 // number of letters flashing in neontextcolor2 (0 to disable)
var flashpause=0 // the pause between flash-cycles in milliseconds

///No need to edit below this line/////
var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')
}
else
document.write(message)
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}

function neon(){
//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
crossref(m).style.color=neonbasecolor
}
//cycle through and change individual letters to neon color
crossref(n).style.color=neontextcolor
if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor
if (n<message.length-1)
n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",flashpause)
return
}
}
function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()
</script></h2>

Keterangan :
Ganti teks Selamat datang di blog pemula ini dengan teks yang ingin ditampilkan
Pada var neonbasecolor="gray" bisa ganti gray dengan warna lain
Pada var neontextcolor="yellow" bisa ganti yellow dengan warna lain
Pada var neontextcolor2="#FFFFA8" bisa ganti #FFFFA8 dengan warna lain
Pada var flashspeed=100 bisa ganti 100 dengan speed yang diinginkan

Contoh hasilnya bisa dilihat di bawah ini :

Artikel Terkait:



7 komentar blog:

Dwi Hery Romans Aremania Singo Edan mengatakan...

thank's sob

Matematika dan aq mengatakan...

thanks prens aq coba n berhasil.....salam kenal
kunanti kunjungan baliknya

Danny mengatakan...

makasih bro....it's really helpfull for me

™KaHuRiPaⁿ™ mengatakan...

thx ea ..
dah ngbantu buatin blog ..

SPC-TRONIK mengatakan...

Thx bro nambah ilmu lg nihhh,artikel yg sngat bermanfaat

Anonim mengatakan...

infonya boleh banget...:-)

NuniUdianiNuni mengatakan...

infony bermanfaat banget, makasih ya:D