cara membuat teks berjalan dengan animasi ganda

Nah dalam tutorial ini saya akan coba membuat teks berjalan seperti yang ada pada efek marque,, tapi  kali ini saya akan menambahkan animasi ganda dengan warna teks yang berubah.. anda juga bisa menggantikan warna yang anda inginkan.. untuk itu anda bisa lihat keterangan yang ada pada tabel yang saya buat di bawah..  contohnya anda bisa lihat yg ada pada sambutan selamat datang pada blog saya   OK lansung saja inilah cara pembuatannya..

Cara membuat Teks Animasi Ganda :

1. Login: Login to BloGGeR (Login ke BloGGeR) dengan cara menuliskan "User Name/alamat email" dan memasukkan "Pasword (Sandi)".
2. Dasboard (Dasbor): KLIK link "Layout (Tata Letak)". Tunggu beberapa saat hingga halaman baru terbuka.
3. Tata Letak (Layout): Saat ini sampeyan ada di halaman "Page Element/Elemen Laman". KLIK "Tambah Gadget (Add Gadget)".
4. Widget: KLIK "HTML/Javascript". Tunggu beberapa saat.
5. HTML/Javascript: Copy paste Javascript ke dalam box penambahan widget (HTML/Javascript).
6. SAVE/Simpan: KLIK "SAVE/Simpan".
7. Buka Blog (Open Blog): Lihat hasilnya dengan membuka blog sampeyan.
8. Efek Animasi Teks ini sudah di coba di BlogSPOT (blog tempat percobaan) dan tampil sangat menarik, tanpa masalah sedikitpun.

Kode HTML dan Javascript Teks Animasi Ganda :

<div style="padding:5px 20px; border:2px solid blue; font-size:21px; font-family:Cataneo BT;font-weight:bolder;"><marquee behavior="scroll" direction="left" onmouseover="stop" onmouseout="run" scrollamount="3">
<script type="text/javascript">
var message="selamat datang di blog saya semoga saja sangat bermanfaat untuk anda terimah kasih"
var bgsGR1color="green" /* Warna utama teks */
var bgsGR2color="red" /* Warna teks flash pertama */
var bgsGR3color="blue" /* Warna teks flash ke dua */
var flashspeed=40 // kec. ganti warna (1/1000 dt)
var flashingletters=50 // jumlah teks pertama
var flashingletters2=50 // jumlah berwarna teks ke dua
var flashpause=30 // waktu jeda pergantian warna (1/1000 dtk)
var n=0
if (document.all||document.getElementById){document.write('<font color="'+bgsGR1color+'">')
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(){if (n==0){for (m=0;m<message.length;m++)
crossref(m).style.color=bgsGR1color}
crossref(n).style.color=bgsGR2color
if (n>flashingletters-1) crossref(n-flashingletters).style.color=bgsGR3color
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=bgsGR1color
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></marquee></div>

• Setelah efek ganda animasi teks bisa terlihat dan animasi berjalan sempurna, lakukan perubahan pada beberapa kode berikut ini :

font-size:21px;	untuk merubah ukuran teks (21px)
border:2px solid blue;	Merubah tebal, bentuk dan warna border
font-family:Cataneo BT;	Merubah Jenis font
font-weight:bolder;	Tebal teks (normal, bold, bolder)
scrollamount="3"	Kecepatan teks berjalan (1 s/d 3)
var bgsGR1color="green"	Warna Teks pertama (warna teks utama)
var bgsGR2color="red"	Warna animasi teks ke dua
var bgsGR3color="blue"	Warna animasi teks ke tiga
var flashspeed=40	Kecepatan perpindahan warna
var flashingletters=50	Jumlah teks beranimasi ke-2
var flashingletters2=50	Jumlah teks beranimasi ke-3
var flashpause=30	Waktu jeda animasi teks