Membuat Text Berjalan (marquee) di Website

Text berjalan atau running text atau yang lebih di kenal dengan nama marquee ini sangat mudah untuk di buat bahkan oleh programer pemula sekalipun. Marquee ini merupakan bagin dari HTML tag dan dapat di jalankan di HTML tanpa harus menggunakan bahasa pemrograman apapun.

Di artikel ini saya akan menjabarkan element-element apa saja yang di butuhkan di dalam tag marquee ini, di dalam tag ini ada beberapa element penting atau element utama dan ada beberapa element pelengkap.

Berikut adalah element utama untuk membuat sebuah text berjalan atau marquee ini. Untuk membuat sebuah marquee di HTML di perlukan tag pembuka element, tag pembuka marquee di tandai dengan <marquee> dan tag penutup </marquee>.

Berikut ini adalah element penting yang harus ada ketika kita membuat marquee:
behaviour : di gunakan untuk menentukan sifat dari gerakan teks berjalan bernilai value scroll(berputar), slide, dan alternate.
direction : di gunakan untuk menentukan arah teks yang akan berjalan dengan nilai value left(kiri), right(kanan), up(atas), down(bawah).
loop : di gunakan untuk menentukan berapa kali teks akan berulang dengan nilai value -1(1x putaran), infinite(terus-menerus).
dan teks yang akan di tampilkan.

Contoh marquee dengan element minimal yang di butuhkan.

teks.html

  1. <html>
  2. <head>
  3. <title>Membuat teks berjalan (marquee)</title>
  4. </head>
  5. <body>
  6. <marquee direction="left" loop="-1">Beberapa teks di sini</marquee>
  7. </body>
  8. </html>

akan menghasilkan:
Beberapa teks di sini

Contoh di atas adalah contoh sederhana yang saya contohkan. Untuk membuat marquee yang lebih kompleks kita harus menambahkan beberapa element lagi seperti warna teks, jenis dan type huruf.

Kita hanya perlu mengubah tag marquee nya menjadi :

  1. <marquee behaviour="scroll" direction="left" loop="infinite" style="background-color: #000000; color: #ffffff; font-family: Arial; font-size: 12pt;">Beberapa teks di sini</marquee>

akan menghasilkan:
Beberapa teks di sini
Mudah bukan..?? Saya kira sampai di sini dulu pertemuan kita, sampai ketemu lagi di artikel berikutnya…..

Leave a Reply

Your email address will not be published. Required fields are marked *