Membuat teks berjalan pada html

Assalamualaikum wr.wb sobat programmer. Kali ini saya akan memberikan materi mengenai cara membuat teks berjalan pada html atau disebut dengan marquee.

Sebelum masuk ke kode programmnya mari kita mengenal terlebih dahulu apa itu marquee? Marquee adalah bahasa HTML untuk memberikan efek sebuah kata atau kalimat menjadi berjalan atau bergerak. Marquee ini mempunyai daya tarik tersendiri karena animasi berjalan/bergeraknya tersebut, selain itu penggunaan marquee bisa menghemat trmpat blog ataupun website .

Nah sekarang kita mengenal beberapa komponen yang ada pada marquee.

• bgcolor : berfungsi untuk mengatur background pada text marquee
• direction : berfungsi untuk mengatur gerakan dari teks marquee tersebut [up , down, right, left]
• scrollamount : untuk mengatur kecepatan dari gerakan teks tersebut[angka dalam px] , semakin tinggi angkat yang digunakan maka akan semakin cepat juga gerakan teks tersebut.
•  behaviour : berfungsi mengatur efek dari gerakannya [slide,alternate,scroll]
• width & height : berfungsi untuk mengatur lebar dan tinggi dari area text [dinyatakan dalam px ataupun %]
• align : berfungsi untuk mengatur posisi sebuah text [left,center,right]
• onmouseover : berfungsi untuk menghentikan efek ketika disorot mouse atau didekati mouse
• onmouseout : berfungsi untuk melanjutkan text ketika mouse tidak mendekati text tersebut

Selain attribut diatas masih banyak lagi penggunaannya tetapi saya disini memberikan attribut yang sering digunakan saja pada web developer.

Selanjutnya kita masuk ke kode programmnya.
Berikut ini kode program sederhana :

1. Penggunaan marquee pada direction and scrollamount.

<marquee direction="right" scrollamount="2px">
  Contoh Marquee dari kiri ke kanan
</marquee>

Untuk right anda bisa diganti dengan left, up ataupun down.

2. Penggunaan marquee pada bacground [bgcolor]

<font color="white">
<marquee direction="right" scrollamount="2px"bgcolor="blue">
Contoh Marquee dengan menggunakan background biru dan warna font putih
</font>
</marquee>

3. Penggunaan marquee pada onmouseover & onmouseout serta height bisa juga ditambah width

<marquee direction="left" scrollamount="2px" onmouseover="this.stop()"onmouseout="this.start()" height="100%">
Contoh marquee berhenti bergerak ketika di sorot mouse dan bergerak kembali ketika sudah tidak di sorot
</marquee>

Nah seperti itulah efek efek yang marquee yang digunakan pada HTML. Semoga bermanfaat untuk kalian semua.