Cara Mudah Belajar Membuat Teks Berjalan Menggunakan Marquee

Di artikel kali ini saya akan membahas bagaimana cara mudah belajar membuat teks yang bisa jalan-jalan sendiri atau bahasa kerennya di sebut dengan running text menggunakan kode marquee, biar tampilan blognya menjadi lebih keren and modis.

Agan mau tahu bagaimana caranya membuat teks yang bisa berjalan atau yang sering di sebut juga dengan running text? tentunya dengan di hiasi teks yang bisa berjalan,blog Agan akan terlihat lebih menarik untuk di kunjungi,dan akan sedikit berbeda dengan yang lain. Baiklah,berikut ini adalah tutorial cara membuat teks berjalan/running text dengan menggunakan kode "MARQUEE". Silahkan Agan lihat caranya secara seksama!

Berikut ini adalah kode dasar "Marquee":

<marquee>MARI BELAJAR MENJADI PUBLISHER GOOGLE ADSENSE</marquee>

Kode di atas akan terlihat seperti ini:

MARI BELAJAR MENJADI PUBLISHER GOOGLE ADSENSE 

Tentunya masih banyak lagi kode "Marquee" yang lainnya,untuk bisa lebih memberikan variasi pada cara membuat teks berjalan.

• kode scrolldelay="angka" yang berfungsi untuk mengatur jeda teks berjalan dalam milidetik.contohnya untuk mengatur jeda satu detik,maka masukkan angka 1000.

Contoh:

<marquee scrolldelay="1000">TEKS BERJALAN DELAY SATU DETIK</MARQUEE>

Hasilnya akan terlihat seperti ini:

TEKS BERJALAN DELAY SATU DETIK

• kode width="lebar" berfungsi untuk mengatur lebar media teks berjalan,bisa di sesuaikan dengan lebar ruang yanga ada,misalnya Anda ingin memasangnya pada 'Sidebar Blog".

Contoh:

<marquee width="50%">TEKS BERJALAN 50 PERSEN</MARQUEE>

Hasilnya akan terlihat seperti ini:

TEKS BERJALAN 50 PERSEN

• kode bgcolor="warna" di gunakan untuk memberikan warna latar belakang teks.

Contoh:

<marquee bgcolor="blue">TEKS BERJALAN DENGAN WARNA LATAR BIRU</marquee>

Hasilnya akan terlihat seperti ini:

TEKS BERJALAN DENGAN WARNA LATAR BIRU

• kode title="pesan" gunanya untuk menampilkan pesan yang Anda buat jika kursor mouse di letakkan pada jalur teks berjalan.

Contoh:

<marquee title="CARA MEMBUAT TEKS BERJALAN">SILAHKAN LETAKKAN KURSOR MOUSE ANDA PADA JALUR TEKS BERJALAN UNTUK MELIHAT CONTOHNYA </marquee>

Hasilnya akan terlihat seperti ini:

SILAHKAN LETAKKAN KURSOR MOUSE ANDA PADA JALUR TEKS BERJALAN UNTUK MELIHAT CONTOHNYA

• kode scrollamount="angka" di gunakan untuk mengatur kecepatan gerakan tulisan,semakin besar angka yang di pasang,maka akan semakin cepat pula gerakan tulisannya.

Contoh:

<marquee scrollamount="10">KECEPATAN GERAK TEKS BERJALAN DENGAN ANGKA 10...!!!</marquee>

Hasilnya akan terlihat seperti ini:

KECEPATAN GERAK TEKS BERJALAN DENGAN ANGKA 10...!!!

• kode direction="left/right/up/down" berfungsi untuk mengatur arah gerak teks.

Contoh:

<marquee direction="right">CONTOH TEKS YANG BERGERAK KE KANAN</marquee>

Hasilnya akan seperti ini:

CONTOH TEKS YANG BERGERAK KE KANAN

• kode behavior="scroll/slide/alternate" yang berfungsi untuk mengatur tipe pergerakan teks.

1. Scroll jika ingin teks bergerak terus ke suatu sisi dan muncul dari sisi yang lain!

2. Slide jika ingin teks bergerak sekali lalu berhenti,kemudian di ulangi lagi!

3. Alternate jika ingin teks bergerak memantul/bouncing dari ujung kembali lagi ke ujung!

Contoh:

<marquee behavior="alternate">TEKS YANG BERGERAK SECARA BOLAK-BALIK</marquee>

Hasilnya akan terlihat seperti ini:

TEKS YANG BERGERAK SECARA BOLAK-BALIK

Contoh kode untuk membuat teks bergerak dari atas ke bawah:

<marquee direction="down" height="100">TEKS YANG BERGERAK DARI ATAS KE BAWAH</marquee>

Hasilnya akan terlihat seperti ini:

TEKS YANG BERGERAK DARI ATAS KE BAWAH

Untuk bisa membuat tulisan berhenti ketika di lintasi kursor mouse,silahkan tambahkan kode berikut ini!

onmouseover="this.stop ( )" onmouseout="this.start ( )"

Contoh:

<marquee behavior="alternate"onmouseover="this.stop () onmouseout="this.start ()"TEKS YANG BEGERAK BOLAK BALIK</marquee>

Untuk melihat hasilnya,silahkan Anda letakkan kursor mouse Anda tepat pada jalur teks!

TEKS YANG BERGERAK BOLAK BALIK

Apakah bisa "Marquee" di beri link? tentu saja bisa! silahkan lihat contoh kode berikut ini:

<marquee direction="left"onmouseover="this.stop()" onmouseout="this.start()" scrollamount="5"> <a href="http://www.keripikku.com/2016/06/raih-sukses-dengan-singkong_1.html">Sukses Memproduksi Keripik Singkong</a>

Hasilnya akan terlihat seperti ini:

Sukses Memproduksi Keripik Singkong

MENGUBAH HURUF,WARNA,DAN UKURAN HURUF TEKS BERJALAN

Jenis gaya huruf bisa di ubah dengan menambahkan kode-kode berikut ini:

style="font-family: impact: font-size:16pix: color:#116cbf:"

• font-family: impact: fungsinya untuk merubah gaya huruf teks,sesuaikan saja dengan gaya huruf yang Anda sukai,contoh: Arial,Georgia dll.
• font-size:16pix: yang berfungsi untuk merubah ukuran huruf teks.
• color: #116cbf: berfungsi untuk merubah warna huruf teks.

Contoh:

<marquee bgcolor="blue" style="georgia: impact; font-size:24px; color:#cc0000;" >TEKS BERJALAN DENGAN LATAR BELAKANG BERWARNA BIRU</marquee>

Hasilnya akan terlihat seperti ini:

TEKS BERJALAN DENGAN LATAR BELAKANG BERWARNA BIRU

Cara untuk memasang kode-kode tersebut adalah,Anda bisa memasang di widget atau bisa juga dalam artikel post.

Untuk Memasang Pada Widget:

• Masuk ke menu "Tata letak"
• Klik 'Tambahkan Gadget"
• Pilih Gadget HTML/JAVASCRIFT
• Masukkan kode yang sudah di buat
• Lalu klik "Simpan"

Untuk Memasang Di Dalam Artikel:

1. Pada saat Anda sedang menulis artikel,kode di copy lalu klik edit "HTML"
2. Jika sudah masuk ke edit "HTML" lalu pastekan kode yang tadi
3. Untuk melihat hasilnya,apakah sudah benar atau belum silahkan klik "Pratinjau" 

Silahkan Anda gunakan kode-kode di atas tadi untuk lebih mempercantik tampilan website atau blog Anda! tentunya supaya blog Anda akan lebih menarik untuk di kunjungi. Anda juga bisa membuat variasi-variasi lain sesuai dengan keinginan Anda. Sekian saja dari saya dan terima kasih,semoga saja bermanfaat.