Tip Blog

Membuat Efek Tulisan Berjalan ( Marquee )

Efek tulisan berjalan ( Marquee ) adalah suatu program HTML untuk membuat teks agar bisa bergerak / berjalan yang merupakan suatu perintah yang dapat kita atur sesuai keinginan. Kode HTML ini banyak sekali di pakai olehpara blogger, karena memang menarik pengunjung untuk melihatnya dan menghemat tempat pada halaman blog. Ada beberapa macam kode marquee untuk model perilaku geraknya ... antara lain :


<marquee>TEXT</marquee>

Kode untuk perilaku gerakan dari kanan ke kiri


<marquee direction="right">TEXT</marquee>

Kode untuk perilaku gerakan dari kiri ke kanan


<marquee behavior="alternate">TEXT</marquee>

Kode untuk perilaku gerakan berjalan ke kiri dan ke kanan


<marquee direction="up">TEXT</marquee>

Kode untuk perilaku gerakan berjalan ke atas


<marquee direction="down">TEXT</marquee>

Kode untuk perilaku gerakan berjalan ke bawah


<marquee direction="up" behavior="alternate">TEXT</marquee>

Kode untuk perilaku gerakan berjalan ke atas dan ke bawah


<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right">TEXT</marquee></marquee>

Kode untuk perilaku gerakan terbang zigzag


<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right" behavior="alternate">TEXT</marquee></marquee>

Kode untuk perilaku gerakan berjalan zigzag ke atas dan ke bawah


<marquee behavior="alternate" width="10%">>></marquee>TEXT<marquee behavior="alternate" width="10%"><<</marquee>

Kode perilaku untuk menampilkan tanda panah ke teks


<font ><marquee direction="left" style="background:BLUE">TEXT</marquee></font>

Kode untuk perilaku gerakan berjalan dari kanan ke kiri dengan latar belakang warna, anda bisa merubahnya dengan kode warna lain


<marquee style="border:BLUE 2px SOLID">TEXT</marquee>

Kode untuk perilaku gerakan berjalan dari kanan ke kiri dengan dikelilingi garis tepi (border)


<marquee behavior="alternate"><marquee width="150">TEXT</marquee></marquee>

Kode untuk perilaku gerakan berjalan dengan hanya menampilkan bagian depan textnya saja atau hidden marquee


<marquee behavior=alternate direction=up scrollamount=2 scrolldelay=65 height=80 style="Text-align;filter:wave(add=0,phase=1, freq=1,strength=15,color=.FFFFFF)"><center>TEXT<br>TEXT</center></marquee>

Kode untuk perilaku gerakan berjalan seperti gelombang ombak ke atas dan ke bawah
Keterangan :
+ Ganti tulisan Text dengan tulisan yang akan di tampilkan sesuai keinginan.

Cara membuatnya :
1. Login to Blogger kemudian pilih "Layout"
2. Klik pada "Page Element" trus pilih "Add a Gadget --> HTML/Javascript" (Tempatnya terserah kamu).
3. Copy Paste Script yang ada tinggal anda edit saja

4. Klik Simpan dan selesai

Ada variasi lain dari marquee lagi, yaitu 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 tsb. Kodenya di bawah ini :




<table border="1" width="341" cellpadding="1" height="260">

<tr>

<td align="right">

<marquee direction="up" onmouseover="this.stop()" width="332" onmouseout="this.start()" scrollamount="2" height="250">

<ul>
<li><a href='http://www.seby-antoe.com/2009/09/cara-back-up-dan-upload-file-java.html' target="_blank">Cara Back Up dan Upload File Java Script ke Free Hosting</a></li>
<li><a href='http://www.seby-antoe.com/2009/09/cara-membuat-animasi-status-loading.html' target="_blank">Cara Membuat Animasi Status Loading</a></li>
<li><a href='http://www.seby-antoe.com/2009/07/cara-membuat-buku-tamu-dengan.html' target="_blank">Cara Membuat Buku Tamu dengan Shoutmix.com</a></li>
<li><a href='http://www.seby-antoe.com/2009/06/cara-membuat-dan-memahami-isi-blog-di.html' target="_blank">Cara Membuat dan Memahami Isi Blog di Blogspot</a></li>
<li><a href='http://www.seby-antoe.com/2009/08/cara-membuat-icon-address-bar-favicon.html' target="_blank">Cara Membuat Icon Address bar ( Favicon ) di Blog</a></li>
<li><a href='http://www.seby-antoe.com/2009/09/cara-membuat-kata-penutup-di-blog.html' target="_blank">Cara Membuat Kata Penutup di Blog Ketika Menutup Blog</a></li>
<li><a href='http://www.seby-antoe.com/2009/07/cara-menampilkan-elemen-halaman-hanya.html' target="_blank">Cara Menampilkan Elemen Halaman Hanya Pada Halaman Depan</a></li>
<li><a href='http://www.seby-antoe.com/2009/07/cara-menampilkan-elemen-halaman-hanya_28.html' target="_blank">Cara Menampilkan Elemen Halaman Hanya Pada Halaman Selanjutnya</a></li>
<li><a href='http://www.seby-antoe.com/2009/07/cara-mudah-menulis-kode-html-di.html' target="_blank">Cara Menulis Kode HTML di Postingan</a></li>
</ul>

</marquee>

</td>

</tr>

</table>