Tips n Trick | Cara Membuat Efek Marquee

Gie Morello Saturday, April 16, 2011 Blogger

Kamu sudah kenal dengan marquee? Marquee adalah suatu program HTML yang membuat teks bisa bergerak atau berjalan. Selain scrollbar, marquee juga digunakan untuk menghemat ruang blog kita dan bisa mempercantik tampilan blog karena bentuknya yang dinamis.

Berikut adalah contoh marquee:Kaskus

Facebook

GieShare

Mau tau cara membuat nya?

Berikut Kode Untuk Membuat Marquee:

1. Marquee Searah
<MARQUEE align="center" direction="right" height="200" scrollamount="2" width="30%">Marquee Dari Kiri ke Kanan</MARQUEE>

Hasilnya:

Marquee Dari Kiri ke Kanan
2. Marquee Mundar-Mandir
<MARQUEE align="center" direction="left" height="200" scrollamount="3" width="70%" behavior="alternate">Marquee Mundar-Mandir</MARQUEE>

Hasilnya:

Marquee Mundar-Mandir
3. Marquee Dengan Variasi Huruf Dan Background
<div align="left"><FONT FACE="monotype corsiva" color="White"><B><MARQUEE BGCOLOR="Green" width="70%" scrollamount="3" behavior="alternate">Marquee Dengan Variasi Huruf Dan Background</MARQUEE></b></FONT></div>

Hasilnya:

Marquee Dengan Variasi Huruf Dan Background

4. Marquee Berhenti Jika Diarahkan Mouse
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">Marquee Berhenti Jika Diarahkan Mouse</marquee>

Hasilnya:

Marquee Berhenti Jika Diarahkan Mouse

Kamu juga bisa memasukkan link ke dalam marquee. Tipe ini sangat cocok untuk membuat Blogroll. Kodenya:

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">
<a href="http://kaskus.us" target="_blank">Kaskus</a><br/>
<a href="http://facebook.com" target="_blank">Facebook</a><br/>
<a href="http://gieshare.blogspot.com" target="_blank">GieShare</a><br/>
</marquee>

Hasilnya:Kaskus

Facebook

GieShare

Keterangan:

1. direction="right" menunjukkan arah marquee. Bisa kamu ganti dengan left, up, atau down.
2. height="200" menunjukkan tinggi marquee
3. width="100%" menunjukkan lebar marquee

Gimana? Sangat menarik kan?

Semoga bermanfaat, salam Blogger Indonesia...!! :D