Cara Membuat Text Tulisan Berjalan dengan Kode HTML

Cara membuat text tulisan berjalan dengan kode HTML - Marquee di web atau blog sebetulnya cukup mudah, hanya dengan cara menempelkan kode pada dokumen HTML web atau blog. Attribut yang digunakan untuk membuat tulisan berjalan ini menggunakan tag <marquee>, sehingga text / tulisan berjalan juga disebut dengan Marquee, berbeda dengan membuat link atau tautan HTML

Cara Membuat Text Tulisan Berjalan dengan Kode HTML

Secara umum syntax kode marquee / text tulisan berjalan adalah:

<marquee>Text Berjalan</marquee> 

Dengan menggunakan syntax text tulisan berjalan diatas Anda dapat membuat bermacam-macam variasi kode Marquee. Cara pemasangan kode marquee dapat Anda lihat pada contoh-contoh berikut:

Jika Anda menggunakan kode marquee seperti berikut,

<marquee bgcolor="orange" style="font-family: Arial; font-size:16px; color:#800C0C;">Contoh Tulisan Berjalan dengan Background Area</marquee>

Maka akan menghasilkan tuisan berjalan seperti ini:
Contoh Tulisan Berjalan dengan Background Area

Jadi hanya seperti itu tulisan berjalan Marquee? Tentu tidak, masih banyak variasi yang dapat kita buat. Berikut adalah varias-variasi kode Marquee nya:

Cara Membuat Text Tulisan Berjalan dengan Kode HTML

Kode Marquee Untuk Mengatur Pengulangan Rotasi
kode loop="value/nilai" digunakan untuk pengulangan berotasi pada Marquee. Setelah berotasi sesuai angka yang ditentukan, maka text tersebut akan hilang. Contoh kodenya seperti berikut,

<marquee loop="100">Text Berotasi 100 Kali</marquee>

Maka akan menghasilkan tuisan berjalan seperti ini:
Text Berotasi 100 Kali

Kode Marquee untuk Mengatur Lebar Text
Kode width="angka lebar" berguna untuk mengatur lebar dari kode text yang yang akan berjalan. Biasanya diatur 50% untuk setengah bidang saja, atau bisa 25% untuk seperempat bidang text berjalan saja. Contoh kodenya sepertiberikut,

<marquee width="50%">Lebar Text Berjalan Setengah Bidang</marquee>

Keterangan: Angka 50% bisa anda ganti sesuai lebar bidang yang anda inginkan.
Maka akan menghasilkan tuisan berjalan seperti ini:
Lebar Text Berjalan Setengah Bidang

Kode Marquee untuk Memberi Link / Tautan pada Text
Kode dasar seperti berikut,
onmouseover="this.stop()" onmouseout="this.start()"
Contoh kodenya:

<marquee direction="left"onmouseover="this.stop()" onmouseout="this.start()"><a href="http://blog.rajaputramedia.com/2014/12/cara-membuat-text-tulisan-berjalan.html">Cara Membuat Text Tulisan Berjalan</a></marquee>

Maka akan menghasilkan tuisan berjalan seperti ini:
Cara Membuat Text Tulisan Berjalan
Kode Marquee untuk Mengatur Kecepatan Jeda
Kode scrolldelay="angka jeda" berfungi untuk mengatur kecepatan jeda dalam milidetik. Contoh kodenya seperti berikut:

<marquee scrolldelay="2000">Text Berjalan dengan Jeda 2 Detik</marquee>

Keterangan: 1000 untuk 1 detik, 2000 untuk 2 detik, dan seterusnya..
Maka akan menghasilkan tuisan berjalan seperti ini:
Text Berjalan dengan Jeda 2 Detik

Kode Marquee untuk memberi Alt Title pada Area Text Berjalan
Kode title="pesan" berfungsi untuk memberi pesan pada saat kursor diarahkan ke area text berjalan. Atau nama lainnya yaitu Alt Title. Contoh kodenya seperti berikut:

<marquee title="Text yang Muncul Jika Pointer Mouse di arahkan ke Area Text Berjalan">Text Berjalan dengan Pesan</marquee>

Maka akan menghasilkan tuisan berjalan seperti ini:
Text Berjalan dengan Pesan

Kode Marquee untuk Mengatur Kecepatan Text Berjalan
Kode scrollamount="angka" berguna untuk mengatur kecepatan laju text yang berjalan. Contoh kodenya seperti berikut:

<marquee scrollamount="5">Kecepatan Text Berjalan adalah 10</marquee>

Keterangan: Semakin besar nilai scrollamount maka akan semakin cepat.
Maka akan menghasilkan tuisan berjalan seperti ini:
Kecepatan Text Berjalan adalah 10

Kode Marquee untuk Mengatur Arah Text Bergerak
Kode direction="left/right/up/down" berguna untuk mengatur arah pergerakan text. Contoh kode nya seperti berikut:

<marquee direction="left">Text akan Bergerak ke Kiri</marquee>

Keterangan: left bisa anda ganti sesuai arah text berjalan yang anda inginkan.
Maka akan menghasilkan tuisan berjalan seperti ini:
Text akan Bergerak ke Kiri

Kode Marquee untuk Mengatur Text Berhenti Jika dilintasi Pointer Mouse
Kode dasar untuk mengatur text agar berhenti jika dilintasi mouse adalah onmouseover="this.stop()" onmouseout="this.start()". Contoh kodenya seperti berikut:

<marquee direction="left"onmouseover="this.stop()" onmouseout="this.start()">Text Bergerak ke Kiri dan akan Berhenti jika dilintasi Mouse</marquee>

Maka akan menghasilkan tuisan berjalan seperti ini:
Text Bergerak ke Kiri dan akan Berhenti jika dilintasi Mouse

Demikian tutorial bagaimana cara membuat text tulisan berjalan dengan kode HTML (Marquee). Jika masih kurang memahami tutorial ini, Anda dapat memberikan pertanyaan melalui form komentar. Semoga dapat membantu

Bagikan Artikel ini