Membuat Efek Tulisan Dengan Warna Bergerak | Neon --- Assalamualaikum,, pada kesempatan kali ini saya akan membagikan tutorial bagaimana cara membuat efek tulisan bergerak, efek yang muncul bukanlah efek marquee pada html karna bukan teksnya yang bergerak, akan tetapi yang bergerak adalah warnanya. Jika anda tertarik memsangnya di blog anda, silahkan lanjutkan membaca :)
Membuat Efek Tulisan Dengan Warna Bergerak | Neon sbb :
1. Silahkan menuju halaman dimana anda akan menempatkan teksnya, bisa di Postingan, Widget dan Template.
2. Copy kode dibwah ini :
<h3><script language="JavaScript1.2">
var message="Selamat Datang"
var neonbasecolor="Cyan"
var neontextcolor="Blue"
var neontextcolor2="Blue"
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
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></h3>
Ket: Merah - Teks yang akan tampil
Biru muda - Warna dasar Teks
Biru - Warna yang akan bergerak
Orange - Kecepatan gerak
Maka Hasilnya Seperti ini :
Selamat Datang
Efek Lainnya :
<h3>
<script language="JavaScript1.2">
var message="Selamat Datang Di Blog Yang Sedehana Ini"
var neonbasecolor="maroon"
var neontextcolor="white"
var flashspeed=100
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>
</h3>
Posting Komentar