19 Januari 2010

Cara Membuat Animasi Teks Berjalan / Bergerak

Dalam postingan kali ini saya mencoba berikan tips tentang Cara membuat animasi teks yang bergerak. Teks berjalan caranya tidaklah begitu rumit, kita hanya perlu memahami mengenai  fungsi dari kode-kode yang bisa membuat object tersebut bergerak.seperti marquee, behavior,scroll amount dan lain sebagainya.

Dibawah ini adalah beberapa contoh Animasi Teks yang menggunakan efek marquee. untuk anda yang berminat,silahkan anda copy kodenya kemudian anda paste ke gadget html anda.
Teks Berjalan Bolak Balik dari Kiri - kanan
Ilmu Itu Murah Maka Amalkanlah
<marquee behavior="alternate" direction="right"
scrollamount="5" scrolldelay="10" >Ilmu Itu Murah Maka Amalkanlah</marquee>

Teks Berjalan Dari kanan kekiri secara bersambung
Ilmu Itu Murah Maka Amalkanlah
<marquee behavior="scroll" direction="left" scrollamount="5"
scrolldelay="10" >Ilmu Itu Murah Maka Amalkanlah</marquee>

Teks Berjalan dari kanan kekiri 10 kali
Ilmu Itu Murah Maka Amalkanlah
<marquee behavior="slide" bgcolor="" direction="left"
loop="10" scrollamount="5" scrolldelay="10">Ilmu Itu Murah Maka Amalkanlah</marquee>

Teks Berjalan dengan efeks Bounce atau ZIG ZAG
Ilmu Itu Murah Maka Amalkanlah
<marquee
behavior="alternate" direction="up" scrollamount="5" scrolldelay="10"
>Ilmu Itu Murah Maka Amalkanlah</marquee>

Teks Berjalan Berjalan Bolak balik dari bawah ke atas
Ilmu Itu Murah Maka Amalkanlah
<marquee
behavior="alternate" direction="up" scrollamount="5" scrolldelay="10" >Ilmu
Itu Murah Maka Amalkanlah</marquee>

Teks Berjalan Berjalan dari bawah ke atas secara bersambung
Ilmu Itu Murah Maka Amalkanlah
<marquee behavior="scroll" direction="up"
style="text-align: center;" scrollamount="5" scrolldelay="10" >Ilmu Itu Murah
Maka Amalkanlah</marquee>

Teks Berjalan Berpencar
Ilmu Itu Murah Maka Amalkanlah Ilmu Itu Murah Maka AmalkanlahIlmu Itu Murah Maka Amalkanlah Ilmu Itu Murah Maka Amalkanlah
<marquee direction="Up" style="text-align: center;">Ilmu
Itu Murah Maka Amalkanlah</marquee> <marquee direction="Left"
style="text-align: center;">Ilmu Itu Murah Maka Amalkanlah</marquee><marquee
direction="right" style="text-align: center;">Ilmu Itu Murah Maka Amalkanlah</marquee>
<marquee direction="down" style="text-align: center;">Ilmu Itu Murah Maka
Amalkanlah</marquee>

*Keterangan :
  Ganti Tulisan "Ilmu Itu Murah Maka Amalkanlah" dengan Kalimat Yang lain.

Selamat Mencoba.