Cara Membuat Tulisan Bergerak (Marquee)

Cara Membuat Tulisan Bergerak (Marquee). Kali ini saya coba berbagi cara membuat tulisan bergerak atau disebut marquee. Telah banyak sekali rekan-rekan bloger yang membahas ini, saya sendiri belum mahir dalam HTML, tapi rasanya tak ada jeleknya saya postingkan bagi rekan yang belum tahu untuk dicoba.


Apa itu marquee? Marquee adalah suatu program HTML untuk membuat teks bisa bergerak atau berjalan. Program marquee ini banyak diminati dan di pakai oleh para blogger di dalam blognya karena sifat program ini yang dinamis serta menarik untuk dilihat, disamping untuk menghemat tempat pada halaman blog. Marquee ini bisa di buat dengan menggunakan tag <marquee>...</marquee>


Atribut yang sering di gunakan adalah :
BGCOLOR="warna" --> Untuk mengatur warna background (latar belakang) teks.
DIRECTION="left/right/up/down" --> Mengatur arah gerakan teks.
BEHAVIOR="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan


Scroll --> teks bergerak berputar
Slide--> teks bergerak sekali lalu berhenti
Alternate --> teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo)


TITLE='pesan" --> Pesan akan muncul saat mouse berada di atas teks
SCROLLMOUNT="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya.
SCROLLDELAY="angka" --> Untuk mengatur waktu tunda gerakan dalam mili detik
LOOP="angka|-1|infinite" --> Mengatur jumlah loop
WIDTH="lebar" --> Mengatur lebar blok teks dalam pixel atau persen


Agar lebih jelas akan coba lihat contoh di bawah ini :

>>Tulisan berjalan ke kanan (lihat tulisan "SELAMAT DATANG DI BLOG" di atas) :
Code:
<marquee behavior="scroll" direction="right">SELAMAT DATANG DI BLOG BERBAGI</marquee><br />

>>Tulisan berjalan dengan gambar :
Code:
<marquee behavior="scroll"><br /> <img src="Url gambar anda" width="110" height="84"><br />Tulisan anda<br /> </marquee><br />

>>Tulisan berjalan ke atas:
Code:
<marquee height="30" behavior="scroll" direction="up">Tulisan  anda</marquee>

>>Tulisan berjalan ke kanan dan ke kiri :
Code:
<marquee width="300" behavior="alternate">Tulisan anda</marquee>

>>Tulisan bergerak zig-zag
Code:
<marquee behavior="alternate" direction="up" height="50px"><br /> <marquee direction="right">Tulisan anda</marquee><br /> </marquee>

>>Tulisan berkedip
Code:
<MARQUEE align='center' behavior='alternate' direction='left' height='20' scrollamount='3' width='50%'>
HARI INI</MARQUEE>
<span/></a></li>

>>Tulisan menurut perilaku gerakan
Code:
<MARQUEE align="center" direction="left" height="200" scrollamount="3" width="70%" behavior="alternate">Tulisan anda</MARQUEE>

>>Tulisan dengan variasi hurup dan warna latar belakang :
Code:
<div align="left"><FONT FACE="georgia" color="White"><B><MARQUEE BGCOLOR="RED" width="70%" scrollamount="3" behavior="alternate"></MARQUEE></b></FONT></div>

Ada variasi lain dari marquee ini, yakni ketika mouse sedang berada di area marquee teks akan berhenti dan ketika mouse di geser kembali ketempat lain maka teks akan bergerak kembali, ini hanya di tambahkan sedikit program pada kolom marquee.
Code:
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="50%" height="200" align="center"></marquee>

>>Marquee yang di dalamnya terdapat link :
Code:
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">

<a href="URL blog anda" target="new">judul blog</a><br/>

<a href="
URL blog anda " target="new">
judul blog </a><br/>

<a href="
URL blog anda " target="new">
judul blog </a><br/>

</marquee>
Inilah beberapa marquee yang dapat saya bagikan. "Jangan lupa ganti tulisan yang berwarna merah dengan tulisan keinginan anda" Karena kode-kode tersebut begitu rumit, mungkin ada kekurangan atau kelalaian dalam tulisan saya, alangkah bahagianya jika anda bersedia memberitahu saya, terima kasih.

Semoga berguna.

Komentar

Postingan populer dari blog ini

Arti dan perbedaan lambang Koperasi Indonesia

Three yellow box

Notasi Ayak-ayakan Pamungkas Pelog Barang