Cara membuat text neon light (efek teks yang menyala secara periodik)

menggunakan javascript kita bisa membuat sebuah efek teks yang menarik yaitu efek neon light (teks yang menyala dari awal karakter hingga karakter akhir. Teks tersebut akan menyala dari awal karakter hingga akhir. Untuk membuat efek neon pada teks cukup copy script di bawah ini, kemudian masukkan ke dalam gadget html/javascript. Script codenya bisa dilihat dibawah ini :

<h2> <script language="JavaScript1.2"> /* Neon Lights Text By JavaScript Kit (http://javascriptkit.com) For this script, TOS, and 100s more DHTML scripts, Visit http://www.dynamicdrive.com */ var message="Selamat datang di blog belajar seo!" var neonbasecolor="gray" var neontextcolor="blue" var flashspeed=100 //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++) //eval("document.all.neonlight"+m).style.color=neonbasecolor crossref(m).style.color=neonbasecolor } //cycle through and change individual letters to neon color crossref(n).style.color=neontextcolor if (n<message.length-1) n++ else{ n=0 clearInterval(flashing) setTimeout("beginneon()",1500) return } } function beginneon(){ if (document.all||document.getElementById) flashing=setInterval("neon()",flashspeed) } beginneon() </script> </h2>

Untuk mengatur efek dan warna sesuai keinginan, lakukan perubahan pada teks yang berwarna hijau di bawah ini: var message="Selamat datang di winduherang blog!" var neonbasecolor="gray" var neontextcolor="blue" var flashspeed=100 //in milliseconds Hasilnya bisa dilihat di bawah ini;

Artikel terkait :