Dengan menambahkan kode Marquee kita bisa membuat tulisan berjalan padablog. Marquee merupakan elemen HTML yang dapat membuat teks atau gambarbergerak ke arah tertentu. Bisa dari atas ke bawah dan sebaliknya ataudari kiri ke kanan atau sebaliknya.
Kode yang digunakan untuk mengatur animasi dan tampilan marquee disebutjuga dengan atribut, beberapa atribut yang sering digunakan dalammarquee yaitu :
behavior : mengatur gaya gerakan, ada tiga jenis gaya gerakan
alternate : Teks bergerak bolak-balik
slide : Teks bergerak haya sekali saja
scroll : Teks bergerak ke satu arah secara terus-menerus
Direction : mengatur arah gerakan teks, ada empat arah gerakan yaitu :
up (down to up) : Teks bergerak ke atas
down (up to down) : Teks bergerak ke bawah
left (right to left) : Teks bergerak ke kiri
right (left to right) : Teks bergerak ke kanan
face : mengatur font (jenis huruf) pada teks, sobat dapatmenggunakan jenis huruf, seperti arial, verdana, times new roman sancourier
color : untuk mengatur warna pada teks, sobat dapat menggunakannama dalam bahasa inggris, seperti green, black, blue, red dan lain-lain
Atau sobat dapat menggunakan kode warna heksadesimal untuk menghasilkanwarnanya seperti #ffffff, #ff5a00.
width : mengatur panjang ruangan marquee dalam satuan pixel. Semakin lebar, arena untuk menampilkan gerakan teks juga semakin luas.
height : Mengatur tinggi ruangan marquee dalam satuan pixel. Semakin lebar, arena untuk menampilkan gerakan teks juga semakin luas.
bgcolor : Mengatur warna background pada arena marquee, sobatdapat menggunakan nama warna atau kode heksadesimal, jika sobat inginmenghilangkan warna background gunakan nama "transparent"
scrolldelay : mengatur waktu tunda gerakan dalam satuan mili detik (0,001 detik)
scrollamount : mengatur kecepatan gerakan dalam satuan pixel, untuk kecepatan paling lambat gunakan nilai 1
loop : mengatur jumlah pengulangan yang dapat dilakukan, setiap kali teks mengulangi gerakannya, nilai loop akan bertambah dengan 1
Di bawah ini ada beberapa contoh efek marquee beserta kode, sobat bisa mencobanya sendiri dan memodifikasi sesuai selera sobat
1. Tulisan warna hitam di atas background warna oranye, bergerak dari kiri ke kanan bolak-balik terus-menerus:
<font face="arial" color="black" size="4"><marqueedirection="right" behavior="alternate" direction="right"scrollamount="2" height="20px" scrolldelay="10" bgcolor="orange"width="450px">TULISAN YANG DITAMPILKAN</marquee></font>
2. Tulisan warna hijau, tanpa background, bergerak dari kanan ke kiri sebanyak tiga kali:
Pier's BLOG
<font face="times" color="green" size="4"> <marqueedirection="left" behavior="scroll" scrollamount="3" height="20px"scrolldelay="10" bgcolor="transparent" loop="3" width="450px"> <ahref="http://nata03111990.blogspot.com target="new">Pier's BLOG</a> </marquee> </font>
3. Marquee Efek Bounce pada gambar dan teks:
<font face="comic sans ms" color="orange" size="4"><marqueescrolldelay="10" behavior="alternate" direction="up" width="450px"scrollamount="2" height="100px" bgcolor="black"><marqueescrolldelay="10" behavior="alternate" direction="left"scrollamount="2">TULISAN YANG DITAMPILKAN
<ahref="http://4.bp.blogspot.com/_G4pp26RoaoU/TQxkvdaSetI/AAAAAAAAAag/pkyL--GMfhw/s1600/Membuat+Tulisan+Berjalan+Di+Blog.jpg"imageanchor="1" style="clear: left; float: left; margin-bottom: 1em;margin-right: 1em;;"><imgsrc="http://4.bp.blogspot.com/_G4pp26RoaoU/TQxkvdaSetI/AAAAAAAAAag/pkyL--GMfhw/s200/Membuat+Tulisan+Berjalan+Di+Blog.jpg"border="0" height="100" width="166" /></a>
</marquee></marquee></font>
4. Marquee yang di dalamnya terdapat teks dari atas ke bawah terus menerus.
<marquee scrollamount="2" direction="down" width="50%" height="200" align="center">
Trik Blogger
<br/>
Wallpaper Gallery
</marquee>
5. Marquee yang di dalam nya terdapat link dari bawah ke atas terusmenerus. Berhenti jika mouse di dalam arena marquee, dilanjutkan jikamouse di luar arena marquee:
Kode yang digunakan untuk mengatur animasi dan tampilan marquee disebutjuga dengan atribut, beberapa atribut yang sering digunakan dalammarquee yaitu :
behavior : mengatur gaya gerakan, ada tiga jenis gaya gerakan
alternate : Teks bergerak bolak-balik
slide : Teks bergerak haya sekali saja
scroll : Teks bergerak ke satu arah secara terus-menerus
Direction : mengatur arah gerakan teks, ada empat arah gerakan yaitu :
up (down to up) : Teks bergerak ke atas
down (up to down) : Teks bergerak ke bawah
left (right to left) : Teks bergerak ke kiri
right (left to right) : Teks bergerak ke kanan
face : mengatur font (jenis huruf) pada teks, sobat dapatmenggunakan jenis huruf, seperti arial, verdana, times new roman sancourier
color : untuk mengatur warna pada teks, sobat dapat menggunakannama dalam bahasa inggris, seperti green, black, blue, red dan lain-lain
Atau sobat dapat menggunakan kode warna heksadesimal untuk menghasilkanwarnanya seperti #ffffff, #ff5a00.
width : mengatur panjang ruangan marquee dalam satuan pixel. Semakin lebar, arena untuk menampilkan gerakan teks juga semakin luas.
height : Mengatur tinggi ruangan marquee dalam satuan pixel. Semakin lebar, arena untuk menampilkan gerakan teks juga semakin luas.
bgcolor : Mengatur warna background pada arena marquee, sobatdapat menggunakan nama warna atau kode heksadesimal, jika sobat inginmenghilangkan warna background gunakan nama "transparent"
scrolldelay : mengatur waktu tunda gerakan dalam satuan mili detik (0,001 detik)
scrollamount : mengatur kecepatan gerakan dalam satuan pixel, untuk kecepatan paling lambat gunakan nilai 1
loop : mengatur jumlah pengulangan yang dapat dilakukan, setiap kali teks mengulangi gerakannya, nilai loop akan bertambah dengan 1
Di bawah ini ada beberapa contoh efek marquee beserta kode, sobat bisa mencobanya sendiri dan memodifikasi sesuai selera sobat
1. Tulisan warna hitam di atas background warna oranye, bergerak dari kiri ke kanan bolak-balik terus-menerus:
<font face="arial" color="black" size="4"><marqueedirection="right" behavior="alternate" direction="right"scrollamount="2" height="20px" scrolldelay="10" bgcolor="orange"width="450px">TULISAN YANG DITAMPILKAN</marquee></font>
2. Tulisan warna hijau, tanpa background, bergerak dari kanan ke kiri sebanyak tiga kali:
Pier's BLOG
<font face="times" color="green" size="4"> <marqueedirection="left" behavior="scroll" scrollamount="3" height="20px"scrolldelay="10" bgcolor="transparent" loop="3" width="450px"> <ahref="http://nata03111990.blogspot.com target="new">Pier's BLOG</a> </marquee> </font>
3. Marquee Efek Bounce pada gambar dan teks:
<font face="comic sans ms" color="orange" size="4"><marqueescrolldelay="10" behavior="alternate" direction="up" width="450px"scrollamount="2" height="100px" bgcolor="black"><marqueescrolldelay="10" behavior="alternate" direction="left"scrollamount="2">TULISAN YANG DITAMPILKAN
<ahref="http://4.bp.blogspot.com/_G4pp26RoaoU/TQxkvdaSetI/AAAAAAAAAag/pkyL--GMfhw/s1600/Membuat+Tulisan+Berjalan+Di+Blog.jpg"imageanchor="1" style="clear: left; float: left; margin-bottom: 1em;margin-right: 1em;;"><imgsrc="http://4.bp.blogspot.com/_G4pp26RoaoU/TQxkvdaSetI/AAAAAAAAAag/pkyL--GMfhw/s200/Membuat+Tulisan+Berjalan+Di+Blog.jpg"border="0" height="100" width="166" /></a>
</marquee></marquee></font>
4. Marquee yang di dalamnya terdapat teks dari atas ke bawah terus menerus.
<marquee scrollamount="2" direction="down" width="50%" height="200" align="center">
Trik Blogger
<br/>
Wallpaper Gallery
</marquee>
5. Marquee yang di dalam nya terdapat link dari bawah ke atas terusmenerus. Berhenti jika mouse di dalam arena marquee, dilanjutkan jikamouse di luar arena marquee:
<marquee onmouseover="this.stop()" onmouseout="this.start()"scrollamount="2" direction="up" width="100%" height="100"align="center">
<ul>
<li><a href=”http://trik-blogger-andreas.blogspot.com/2010/12/membuat-title-blog-menjadi-huruf.html”target=”new”> Membuat Title Blog Menjadi HurufBerjalan</a></li>
<li><a href=”http://trik-blogger-andreas.blogspot.com/2010/12/cara-import-dari-wordpress-ke-blogger.html”target=”new”>Cara Import Dari Wordpress Ke Blogger</a></li>
<li><a href=”http://trik-blogger-andreas.blogspot.com/2010/12/memasang-kotak-profil-di-bawah.html”target=”new”> Memasang Kotak Profil Di BawahPostingan</a></li>
</ul>
</marquee>
Selamat mencoba semoga berhasil
<ul>
<li><a href=”http://trik-blogger-andreas.blogspot.com/2010/12/membuat-title-blog-menjadi-huruf.html”target=”new”> Membuat Title Blog Menjadi HurufBerjalan</a></li>
<li><a href=”http://trik-blogger-andreas.blogspot.com/2010/12/cara-import-dari-wordpress-ke-blogger.html”target=”new”>Cara Import Dari Wordpress Ke Blogger</a></li>
<li><a href=”http://trik-blogger-andreas.blogspot.com/2010/12/memasang-kotak-profil-di-bawah.html”target=”new”> Memasang Kotak Profil Di BawahPostingan</a></li>
</ul>
</marquee>
Selamat mencoba semoga berhasil