Cara Membuat Teks Bergerak (Marquee)

Marquee - Teks yang bergerak atau disebut dengan marquee ini banyak sekali digunakan di tampilan berita, iklan atau pengumuman. Jika anda ingin mempercantik blog/web anda tidak ada salahnya untuk menerapkan Teks bergerak ini, Selain kelihatan cantik dan praktis penempatanya pun bisa di bilang hemat tempat. Untuk arah pergerakan teks ini ada bermacam-macam jenisnya. Untuk Penerapanya anda bisa menambahkan di widget anda [[ Dashboard > Rancangan/Design > Laman Elemen/Add Page Elemen > Tambah Gadget/Add Gadget > HTML/JavaScript ]]

Teks Bergerak (Marquee)

1. Gerakan Teks dari Kanan ke Kiri (standar pabrik HTML)

Teks bergerak alias standar pabrikan

Code HTML nya

<marquee> Teks bergerak alias standar pabrikan </marquee>

2. Gerakan Text dari Kanan ke Kiri dengan Background

Teks berjalan dengan background warna

Code HTML nya

<marquee bgcolor="Maroon" height="60" width="auto">Teks berjalan dengan background warna
</marquee>

Catatan : Untuk mengganti warna Silahhkan ganti "bgcolor="Maroon" dengan warna kesukaan anda, lihat di tabel warna untuk memperjelas nama dan codenya

3. Gerakan Teks dari Kiri ke Kanan

Gerakan Teks dari Kiri ke Kanan

Code HTML nya

<marquee behavior="scroll" direction="right" height="20" width="auto">Gerakan Teks dari Kiri ke Kanan</marquee>

Catatan : Untuk mengganti arah gerakan ganti " direction="right" " menjadi "left"

4. Gerakan Teks Bebas berdasar Kecepatan

Gerakan Text dari Kiri Secara LAMBAT
Gerakan Text dari Kanan Secara CEPAT

Code HTML nya

<marquee behavior="scroll" direction="left" scrollamount="5">Gerakan dari Kiri Secara LAMBAT</marquee>
<marquee behavior="scroll" direction="right" height="30" scrollamount="30" width="auto">Gerakan Texr dari Kanan Secara CEPAT</marquee>

Catatan :

- direction="left" atau "right" : Adalah Arah gerakan ganti sesuai keinginan anda
- scrollamount="5" : Adalah Kecepatan pergerakan text, semakin tinggi nilainya maka akan semakin cepat gerakanya.

5. Gerakan Text Memantul Ke Kanan dan Ke Kiri

Gerakan Text Memantul Ke Kanan dan Ke Kiri

Code HTML nya

<marquee behavior="alternate">Gerakan Text Memantul Ke Kanan dan Ke Kiri</marquee>

6. Gerakan Text dari Atas ke Bawah

Gerakan Text dari Atas ke Bawah

Code HTNL nya

<marquee behavior="scroll" direction="down" height="60" width="auto">
Gerakan Text dari Atas ke Bawah
</marquee>

Catatan :

- direction="down" : Ganti dengan "up" jika ingin bergerak ke Atas

7. Gerakan Teks Dalam Text Area, Scrollbox atau sejenisnya

Tutorial Blogger
Customizer
Iklan Baris
Arsip Photo Artis

Code HTML nya

<div style="border: 1px solid rgb(202, 61, 217); height: 120px; overflow: auto; padding: 2px;">
<p>
<marquee behavior="scroll" scrollamount="5" direction="down">
<a href="http://e-note.blogspot.com/">Tutorial Blogger</a>
<a href="http://aandfx.blogspot.com/">Customizer</a>
<a href="http://www.blokcepu.org/">Iklan Baris</a>
<a href="http://www.arsipphotoartis.com/">Arsip Photo Artis</a>
</marquee>
</p>
</div>

Catatan :

- direction="down" : Adalah Arah gerakan ganti sesuai keinginan anda
- scrollamount="5" : Adalah Kecepatan pergerakan text, semakin tinggi nilainya maka akan semakin cepat gerakanya.

8. Gerakan Text Memantul Ke Atas dan Ke bawah

CONTENT I
CONTENT II
CONTENT III
CONTENT IV

Code HTML nya

<marquee align="center" behavior="alternate" direction="down" height="100" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="4" width="100">
CONTENT I
CONTENT II
CONTENT III
CONTENT IV
</marquee>

9. Gunakan Script Di Bawah ini untuk mengatur Ukuran dan Warna Text

<marquee><font size='4' face='philosopher' color=#006FC4> Selamat Mencoba Dan Sukses Selalu Terima Kasih </font></marquee>

Hasilnya
Selamat Mencoba Dan Sukses Selalu Terima Kasih

Itulah Varian dari efek Marquee yang saya tahu, jika ada varian yang lainya silahkan anda tambahkan. Silahkan anda lihat dan pilih mana yang cocok dengan kehendak hati anda guna mempercantik tampilan blog/wed anda, semakin unik anda mempercantiknya maka semakin jenius pula anda. jika ada yang kurang jelas silahkan anda tanyakan tak perlu malu untuk bertanya kita semua sama. Selamat Mencoba dan Sukses Selalu.