-->

Jumat, 10 Februari 2012

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 :
</div>
<div style="color: #f3f3f3;">
<br /></div>
<div style="color: #f3f3f3;">
<a href="http://www.blogger.com/blogger.g?blogID=4388797597050742135" name="more"></a></div>
<div style="color: #f3f3f3;">
<br /></div>
<blockquote style="color: #f3f3f3;">
<h2>





<script language="JavaScript1.2">
<br>
//Neon Lights Text II by G.P.F. (gpf@beta-cc.de)<br>
//visit http://www.beta-cc.de<br>
//Visit http://www.dynamicdrive.com for this script <br>
<br>
var message="Selamat datang di blog pemula ini!"<br>
var neonbasecolor="gray"<br>
var neontextcolor="yellow"<br>
var neontextcolor2="#FFFFA8"<br>
var flashspeed=100      // speed of flashing in milliseconds<br>
var flashingletters=3      // number of letters flashing in neontextcolor<br>
var flashingletters2=1      // number of letters flashing in neontextcolor2 (0 to disable)<br>
var flashpause=0      // the pause between flash-cycles in milliseconds<br>
<br>
///No need to edit below this line/////<br>
var n=0<br>
if (document.all||document.getElementById){<br>
document.write('<font color="'+neonbasecolor+'">')<br>
for (m=0;m<message.length;m++)<br>
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')<br>
document.write('</font>')<br>
}<br>
else<br>
document.write(message)<br>
function crossref(number){<br>
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)<br>
return crossobj<br>
}<br>
<br>
function neon(){<br>
//Change all letters to base color<br>
if (n==0){<br>
for (m=0;m<message.length;m++)<br>
crossref(m).style.color=neonbasecolor<br>
}<br>
//cycle through and change individual letters to neon color<br>
crossref(n).style.color=neontextcolor<br>
if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2 <br>
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor<br>
if (n<message.length-1)<br>
n++<br>
else{<br>
n=0<br>
clearInterval(flashing)<br>
setTimeout("beginneon()",flashpause)<br>
return<br>
}<br>
}<br>
function beginneon(){<br>
if (document.all||document.getElementById)<br>
flashing=setInterval("neon()",flashspeed)<br>
}<br>
beginneon()<br>
</script></h2>
</blockquote>
<div style="color: #f3f3f3;">
<br /></div>
<div style="color: #f3f3f3;">



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 :

Selamat datang di blog pemula ini!

0 komentar:

Posting Komentar

The title of the slideout

Slideout Content