Belajar NgeBLOG : Cara Membuat Tulisan Berjalan di Blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Cara Membuat Tulisan Berjalan di Blog

1. Tulisan bergerak dari kanan ke kiri

<marquee direction="left" scrollamount="2" align="center">Contoh Tulisan Berjalan</marquee>

hasilnya

Contoh Tulisan Berjalan

2. Tulisan bergerak dari kiri ke kanan

<marquee direction="right" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>

hasilnya

Contoh Tulisan Berjalan

3. Teks bergerak bolak balik ( mondar - mandir ) dari kiri ke kanan

<marquee direction="left" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>

hasilnya

Contoh Tulisan Berjalan

4. Teks bergerak bolak balik ( mondar - mandir ) dari kanan ke kiri

<marquee direction="right" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>

hasilnya

Contoh Tulisan Berjalan

5. Teks bergerak dari atas ke bawah

<marquee direction="down" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>

hasilnya

Contoh Tulisan Berjalan

6. Teks bergerak dari bawah ke atas

<marquee direction="up" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>

hasilnya

Contoh Tulisan Berjalan

7. Teks bergerak mondar- mandir dari atas ke bawah

<marquee direction="up" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>

hasilnya

Contoh Tulisan Berjalan

8. Teks bergerak zig - zag ( diagonal ) memantul

<center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right" behavior="alternate"> Contoh Tulisan Berjalan </marquee></marquee></center>

hasilnya

Contoh Tulisan Berjalan

9. Teks bergerak zig - zag ( diagonal ) tembus

<center><marquee direction="up" scrollamount="2" align="center" behavior="alternate" width="90%"><marquee direction="right"> Contoh Tulisan Berjalan </marquee></marquee></center>

hasilnya

Contoh Tulisan Berjalan

Cara memasang :
1. Login ke akun blog sobat
2. Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
3. Masukkan kode marquee dari salah satu tulisan berjalan diatas
4. Klik save dan lihat hasilnya.

tambahan :

Direction : untuk mengatur pola gerakan teks (left, right, up dan down)
Scrollamount : untuk mengatur kecepatan gerakan teks. Naikkan angkanya ( dari 2 menjadi 3 ) untuk mempercepat gerakan dan sebaliknya.
Behavior ( scroll/slide/alternate ): untuk mengatur prilaku gerakan.
Untuk menambahkan background, padding, border, color, dll pada marquee, silahkan sisipkan kode marquee antara kode berikut

<div style="background: #000000; border: 2px solid #FF0000; color: white; font-size: 20px; font-weight: bold; letter-spacing: 0.5em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center">Contoh Tulisan Berjalan</marquee>
</div>

hasilnya :

Contoh Tulisan Berjalan

Untuk menyisipkan link pada marquee, gunakan kode berikut :

<div style="background: #FFFFFF; border: 2px solid #FF0000; color: black; font-size: 20px; font-weight: bold; letter-spacing: 0.2em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center"><a href="http://blogklopedia.blogspot.com/2013/10/cara-membuat-tulisan-berjalan-di-blog.html"/>Cara Membuat Teks Berjalan di Blog</a></marquee>
</div>

catatan :
ganti tulisan yang berwana biru dengan Url yang di inginkan.

hasilnya :

Cara Membuat Teks Berjalan di Blog

Contoh lain penggunaan link pada marquee yaitu dengan menggunakan kode berikut :

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center">
<a href=http://blogklopedia.blogspot.com/2013/10/cara-membuat-zoom-effect-gambar-di-blog.html">cara membuat efek zoom pada gambar di blog</a><br/>
<a href="http://blogklopedia.blogspot.com/2013/10/membuat-auto-readmore-dengan-gambar.html">cara membuat readmore dan gambar</a><br/>
<a href="http://blogklopedia.blogspot.com/2013/10/cara-memasang-widget-jam-garuda-di-blog.html">memasang widget jam garuda di blog</a><br/>
</marquee>