Cara membuat teks berjalan (Marquee Text)

1.1 Teks ini bisa bergerak lalalala 1.2 Teks ini bisa bergerak juga lalalala 1.3 Yang ini bisa nge bounce lalalala 1.4 Kalau ini mouse bisa istirahat dan kembali berjalan 1.5 yang ini bisa di klik wiw 1.6 bisa jalan dan berwarna wiw 1.7 kecepatannya beda sama yang lain nih  

Mau teks anda seperti itu?
Jaman sekarang sudah banyak yang mengatakan bahwa teks diatas adalah 'alay'. Ah biarlah, kita hanya mempelajarinya saja.

Bismillahirramanirrahiim ...

Dalam artikel kali ini yang akan dibahas adalah Marquee. Apa itu marquee? saya juga tidak begitu mengerti kenapa dinamakan nya marquee. Kalau saya translate di Google Translate, artinya adalah Tenda Besar. Entahlah, mungkin dari dalam tenda yang besar itu banyak orang yang sedang lewat. Marquee adalah teks yang bisa berjalan atau bergerak. Seperti contoh yang saya tulis diatas. Marquee mempunyai berbagai macam variasi kode yang bisa digunakan.

Disini akan saya coba bahas satu persatu sesuai contoh yang diatas,

1.1 MARQUEE

<marquee> Teks Anda </marquee> 

Jika kita menuliskan kode persis seperti diatas, maka teks akan secara 'default' akan bergerak dari kanan ke kiri dengan kecepatan yang default juga.

1.2 ARAH MARQUEE

<marquee direction='right'> Teks Anda </marquee>

Hampir sama dengan kode marquee 1.1 , yang ini hanya ditambahkan 'direction' di depan teks marquee. Jika kita menulis 'right' maka teks akan bergerak dari arah kiri ke kanan. Selain arah kanan, kita juga bisa mengarahkan nya ke kiri, atas, dan bawah.
Atas = Top / Up
Bawah = Down / Bottom
Kanan = Right
Kiri = Left

1.3 BOUNCE

<marquee behavior='alternate'> Teks Anda </marquee>

Nah dengan kode ini teks nya bisa bergerak secara 'bounce' yang ada dalam tampilan kaca monitor. Maksudnya bounce adalah bergerak memantul dari kiri ke kanan seperti bola memantul.

1.4 ISTIRAHAT SEJENAK DAN BERGERAK

<marquee  onmouseover='this.stop()' onmouseout='this.start()'> Teks Anda </marquee>

Dengan menggunakan kode ini, apabila kita arahkan kursor ke teks berjalan ini, maka teks akan berhenti. Dan jika kursor kita pindahkan dari teks ini, maka teks akan kembali berjalan.

1.5 MARQUEE + LINK

<a href='http://nugrahaup.blogspot.com/'><marquee> Teks Anda </marquee></a>

Disini kita hanya perlu untuk menambahkan tag html '<a></a>' yang fungsinya untuk membuat hyperlink atau yang sering dikatakan orang banyak adalah Link. Kita bisa mengganti link yang berwarna merah sesuai link yang kita inginkan.

1.6 MARQUEE COLOR

<marquee><span style='color: Blue;'> Teks Anda </span></marquee>

<marquee><font color='Blue'> Teks Anda </font></marquee> 

Sama saja seperti hyperlink diatas, disini kita hanya menambahkan tag html <span></span> atau <font></font>. Kita bisa mengganti warna sesuai dengan warna yang kita inginkan. Cukup mengganti teks warna biru dengan kode red, white, green, dan lain-lain.

1.7 MARQUEE SPEED

<marquee scrollamount='30'> Teks Anda </marquee>

Setelah kode marquee, kita perlu menambahkan scrollamount agar teks nya bisa bergerak lebih cepat atau lebih lambat dari sebelumnya. Kita bisa mengubah kecepatannya menjadi 10, 20, 30, 40, 55, 64, 23, dan lain lain terserah dengan yang kalian inginkan.


Teks marquee bisa divariasikan dengan tag html lainnya. Bisa digunakan untuk menggerakan gambar, dan lain-lain. Nah, itulah dasar-dasar dari marquee text. Sisanya hanya tinggal divariasikan sesuai dengan yang kalian inginkan. Terimakasih :)

keyword : cara membuat text berjalan, tutorial membuat teks bergerak, teks berjalan, teks bergerak, marquee text