Cara Membuat Teks Berjalan ( Marquee ) Pada Blog

Beberapa waktu kemarin saya pernah berfikiran, kira-kira cara membuat teks berjalan itu gimana ya? Soalnya nya gini, dulu waktu saya masih memakai handphone symbian S60 an, zaman masa jaya nya handphone nokia dulu, saya pernah mempunyai satu aplikasi yang nama nya "Marquee" yang bisa membuat teks berjalan di layar handphone. Terus saya penasaran, kira-kira untuk sebuah blog bisa nggak ya buat teks berjalan seperti itu? Seperti teks berita yang berjalan dibawah layar TV kita biasanya. Setelah nanya-nanya dan balik sana-sini di mbah google dengan keyword "How to create marquee on Blog" ketemu deh gimana caranya. Sebelumnya kata "Marquee" dalam bahasa programing biasanya identik dengan tulisan / teks berjalan, sedangkan kalau kita terjemahkan kedalam bahasa indonesia, kata "Marquee" itu berarti "Tenda Besar" kalau dipikir-pikir nggak nyambung juga. Oke, kita langsung saja . . .

Cara membuat Marquee / Teks berjalan pada blog itu adalah dengan menggunakan kombinasi bahasa html, misalnya untuk membuat teks berjalan dari kiri ke kanan, dari atas ke bawah, teks berjalan zig-zag, teks berjalan marquee dengan penambahan background pada teks atau juga mengubah style atau warna font, dan mengatur kecepatan teks. untuk lebih lengkap nya kita bisa lihat script code html untuk teks berjalan / marquee DISINI. 

Contoh bahasa HTML untuk Marquee :

• Menambahkan Backround pada teks berjalan

  Kode : bgcolor="blue" (Blue adalah kode warna, bisa diganti dengan warna favorite sobat) Contoh penerapan kode : <marquee bgcolor="Blue"> Tulis Teks Di Sini</marquee>

•  Mengatur Kecepatan Teks Berjalalan

  Kode : scrollamount="2" (Angka 2 adalah kecepatan teks berjalan, silahkan disesuaikan) Contoh penerapan kode : <marquee scrollamount="2"> Tulis Teks Di Sini</marquee>

•  Mengatur Lebar Teks Berjalan 

Kode : width="300" (Atur sendiri lebarnya. Kalau sobat blogger ingin mengatur tingginya juga, sobat blogger tinggal mengganti kata width menjadi hight) Contoh penerapan kode : <marquee width="300"> Tulis Teks Di sini</marquee>

• Teks Berhenti Ketika Diarahkan Cursor 

Kode : onMouseOver="this.stop()" onMouseOut="this.start()" Contoh penerapan kode : <marquee onMouseOver="this.stop()" onMouseOut="this.start()"> Tulis Teks Di Sini</marquee>

• Mengatur Jeda Teks

<marquee scrolldelay="500"> 500 disini maksudnya adalah 0,5 Detik bukan 500 Detik. Jadi kode diatas jika dijalankan akan membuat Teks yang ada didalam kode <marquee></marquee> berhenti sejenak setiap 0,5 Detik. Contoh penerapan kode : <marquee scrolldelay="500">Tulis Teks Di Sini</marquee>

Dibawah ini adalah contoh kombinasi Script code HTML nya marque dengan mengatur align, direction, scrollamount, scrolldelay, behavior, background, color height, dan witdh.

Teks Berjalan Ke Kiri

          Code :

<marquee> Tulis Teks Disini </marquee>

Hasil nya : 

Teks Berjalan Ke Kiri . . .  

Teks Berjalan Ke Kanan

          Code :

<marquee direction="right"> Tulis Teks Disini </marquee>

Hasil nya :

Teks Berjalan Ke Kanan . . .  

Teks Berjalan Ke Atas

          Code :

<marquee direction="up"> Tulis Teks Disini </marquee>

Hasil nya :

Teks Berjalan Ke Atas . . .

 

Teks Berjalan Kebawah

          Code : 

<marquee direction="down"> Tulis Teks Disini </marquee>

Hasil nya :

Teks Berjalan Kebawah . . .  

Teks Berjalan Bolak-Balik ( Memantul )

          Code :

<marquee behavior="alternate"> Tulis Teks Disini </marquee>

Hasil nya :

Teks Berjalan Bolak-Balik ( Memantul ) . . .  

Teks Berjalan Zig-Zag 

          Code :

<marquee direction="up" behavior="alternate"><marquee behavior="alternate"> Tulis Teks Disini </marquee></marquee>

Hasil nya : Teks Berjalan Zig-Zag . . . 

 

Teks Berjalan Dengan Link URL

          

Code :

<marquee align="center" height="25" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" width="500%"><a href="URL LINK">Judul URL</a></marquee>

Hasil nya :

Cara Membuat Teks Berjalan ( Marquee ) Pada Blog  

Teks Berjalan Dengan Background dan Warna Font

          Code : 

<marquee style="background: yellow; color: red;">Tulis Teks Disini</marquee>

Hasil nya :

Teks Berjalan Dengan Background dan Font Berwarna

 

Teks Berjalan Dengan Mengatur Kecepatan Teks

       Code :

<marquee scrollamount="10">Tuliskan Teks Di Sini</marquee>

Hasil nya : 

Teks Berjalan Dengan Kecepatan Teks Amount 10

Teks Berjalan Berhenti Disentuh Cursor

  

    Code :

<marquee onmouseover="this.stop()" onmouseout="this.start()">Tuliskan Teks Di Sini</marquee>

Hasil nya :

Contoh Teks Yang Dikenai Marquee Dan Akan Berhenti Jika Ada Kursor Diatasnya

Teks Berjalan Jeda

     Code : 

<marquee scrolldelay="500">Tuliskan Teks Di Sini</marquee>

Hasil nya :

Contoh Teks Berjalan dengan Jeda Marquee Scrolldelay 500

Sampai disini dulu postingan tentang Cara Membuat Teks berjalan ( Marquee ) Pada Blog. Semoga bisa bermanfaat bagi kita semua. Jika ada pertanyaan atau masih ada yang belum bisa dipahami, bisa langsung disampaikan pada form komentar. Secepatnya saya akan respon, sekian dulu dan Terima kasih.