Cara Membuat Tulisan Berjalan di Blog atau Web dengan Kode HTML

Nah, sore menjelang malam ini ABP akan memberikan postingan mengenai Cara Membuat Tulisan Berjalan di Blog atau Web dengan Kode HTML. Sebelumnya ABP telah menjelaskan pengertian HTML di postingan dengan judul Pengertian HTML, CSS, PHP, Javascript dan JQuery.

Oke, cara membuat text tulisan berjalan dengan kode HTML di web atau blog sebetulnya cukup mudah, hanya dengan cara meletakkan kode pada dokumen HTML Web atau Blog. Attribut yang digunakan untuk membuat tulisan berjalan ini menggunakan tag <marquee>.

Secara umum syntax kode marquee / tulisan berjalan adalah

<marquee> Tulisan Berjalan </marquee>

Dengan menggunakan syntax diatas Anda dapat membuat bermacam-macam variasi kode Marquee. Untuk pemasangan kode marquee dapat di lihat pada contoh-contoh berikut:

Jika Anda menggunakan kode marquee seperti berikut :

<marquee bgcolor="blue" style="font-family: Arial; font-size:16px; color:#800C0C;">Ans Blog Project </marquee>

Maka akan menghasilkan tuisan berjalan seperti ini:

Ans Blog Project

Disini ABP akan memberikan 8 jenis kode Marquee, walaupun masih banyak terdapat jenis kode Marquee lainnya.

1. Kode Marquee untuk Mengatur Pengulangan Rotasi
Contoh kodenya seperti berikut :

<marquee loop="100">Ans Blog Project berotasi 100 Kali</marquee>

Keterangan :
Kode loop="value/nilai" berfungsi untuk pengulangan berotasi pada Marquee. Setelah berotasi sesuai angka yang ditentukan, maka text tersebut akan hilang.

Hasil dari kode diatas adalah :

Ans Blog Project berotasi 100 Kali

2. Kode Marquee untuk Mengatur Lebar Text
Contoh kodenya seperti berikut :

<marquee width="50%">Lebar Text Berjalan Setengah Bidang</marquee>

Keterangan :
Kode width="angka lebar" berfungsi untuk mengatur lebar dari kode text yang yang akan berjalan. Biasanya diatur 50% untuk setengah bidang saja, atau bisa 25% untuk seperempat bidang text berjalan saja.
Angka 50% bisa diganti sesuai lebar bidang yang diinginkan.

Hasil kode diatas adalah :

Lebar Text Berjalan Setengah Bidang

3. Kode Marquee untuk Memberi Link / Tautan pada Text
Contoh kodenya seperti berikut :

<marquee direction="left"onmouseover="this.stop()" onmouseout="this.start()"><a href="http://ansritonga.blogspot.com/2015/02/cara-membuat-tulisan-berjalan-di-blog.html">Cara Membuat Tulisan Berjalan di Blog</a></marquee>

Hasil dari kode diatas adalah :

Cara Membuat Tulisan Berjalan di Blog

4. Kode Marquee untuk Mengatur Kecepatan Jeda
Contoh kodenya seperti berikut :

<marquee scrolldelay="5000">Text Berjalan dengan Jeda 2 Detik</marquee>

Keterangan :
Kode scrolldelay="angka jeda" berfungi untuk mengatur kecepatan jeda dalam milidetik.

1000 untuk 1 detik, 2000 untuk 2 detik, dan seterusnya..

Hasil dari kode diatas adalah :

Text Berjalan dengan Jeda 2 Detik

5. Kode Marquee untuk memberi Alt Title pada Area Text Berjalan
Contoh kodenya seperti berikut:

<marquee title="Ans Blog Project">Text Berjalan dengan Pesan</marquee>

Keterangan :
Kode title ="kode judul" berfungsi untuk memberi judul pesan pada saat kursor diarahkan ke area text berjalan atau nama lainnya yaitu Alt Title.

Hasil dari kode diatas adalah :

Text Berjalan dengan Pesan

6. Kode Marquee untuk Mengatur Kecepatan Text Berjalan
Contoh kodenya seperti berikut:

<marquee scrollamount="5">Kecepatan Text Berjalan adalah 5</marquee>

Keterangan :
Kode scrollamount="angka" berguna untuk mengatur kecepatan laju text yang berjalan.
Semakin besar nilai scrollamount maka akan semakin cepat.

Hasil dari kode diatas adalah :

Kecepatan Text Berjalan adalah 5

7. Kode Marquee untuk Mengatur Arah Text Bergerak
Contoh kode nya seperti berikut :

<marquee direction="right">Text akan Bergerak ke Kanan</marquee>

Keterangan :
Kode direction="left/right/up/down" berguna untuk mengatur arah pergerakan text.
Right bisa di ganti sesuai arah text berjalan yang anda inginkan.

Hasil kode diatas adalah :

Text akan Bergerak ke Kanan

8. Kode Marquee untuk Mengatur Text Berhenti Jika dilintasi Pointer Mouse
Contoh kodenya seperti berikut:

<marquee direction="left"onmouseover="this.stop()" onmouseout="this.start()">Text Bergerak ke Kiri dan akan Berhenti jika dilintasi Mouse</marquee>

Keterangan :
Kode dasar untuk mengatur text agar berhenti jika dilintasi mouse adalah onmouseover="this.stop()" onmouseout="this.start()"

Hasil kode diatas adalah :

Text Bergerak ke Kiri dan akan Berhenti jika dilintasi Mouse

Sekian dulu ya postingan malam ini, semoga dapat menambah ilmu Anda dalam mengembangkan blog maupun website. Sampai jumpa dipostingan berikutnya.