Bagaimana cara membuat teks/tulisan berjalan? teks atau teks berjalan atau running text ini biasa juga kita sebut marquee, karena untuk membuatnya menggunakan kode html marquee. Tulisan ini bisa membuat blog anda terlihat lebih menarik bagi pengunjung, untuk membuat tulisan berjalan atau Marquee ini sebenarnya sangat mudah. Kali ini kita akan mencoba membuat beberapa jenis marquee, agar lebih banyak variasi yang bisa anda pilih. Terlebih dulu kita akan belajar membuat kodenya, lalu belajar cara memasangnya pada blog, berikut kode dasar untuk membuat marquee atau teks berjalan adalah....
<marquee>CONTOH TULISAN BERJALAN</marquee>
Kode Diatas akan terlihat seperti ini:
Tapi selain kode di atas ada beberapa tambahan kode yang bisa anda berikan untuk membuat variasi dari marquee. Di bawah ini kita akan berikan kodenya dan sekaligus mempraktikkan marquee tersebut....
kode scrolldelay="angka" digunakan untuk mengatur jeda dalam milidetik, jadi untuk jeda 1 detik masukkan nilai 1000
Contoh:
<marquee scrolldelay="500">TULISAN BERJALAN DELAY 0.5 DETIK</marquee>
Hasil dari kode diatas:
Kode loop="angka|-1|infinite" digunakan untuk mengatur pengulangan atau repetisi dari marquee
Contoh:
<marquee loop="3">TULISAN BERJALAN BEROTASI 3X</marquee>
Hasil dari kode diatas:
Kode width="lebar" digunakan untuk mengatur lebar media teks berjalan, bisa dalam satuan pixel atau persen dari bidang yang ada
Contoh:
<marquee width="50%">TULISAN BERJALAN LEBAR 50%</marquee>
Hasil dari kode diatas:
Kode bgcolor="warna" digunakan untuk memberikan warna latar pada teks
Contoh:
<marquee bgcolor="blue">TULISAN BERJALAN LATAR BIRU</marquee>
Hasil dari kode diatas:
Kode title="pesan" digunakan untuk memunculkan pesan jika kursor mouse diletakkan di jalur teks berjalan
Contoh:
<marquee title="MUNCUL PESAN TEKS">TULISAN BERJALAN DENGAN PESAN</marquee>
Hasil dari kode diatas:
Kode scrollamount="angka" digunakan untuk mengatur kecepatan pergerakan tulisan semakin besar angkanya semakin kencang
Contoh:
<marquee scrollamount="15">TULISAN BERJALAN KECEPATAN 15</marquee>
Hasil dari kode diatas:
Kode direction="left/right/up/down" digunakan untuk mengatur arah pergerakan running text
Contoh kode:
<marquee direction="right">TULISAN BERJALAN KANAN</marquee>
Hasil dari kode diatas:
Kode behavior="scroll/slide/alternate" digunakan untuk mengatur type pergerakan Scroll jika ingin teks bergerak terus ke suatu sisi dan muncul dari sisi lain, Slide jika ingin teks bergerak sekali kemudian berhenti dan diulangi lagi, Alternate jika ingin teks terlihat memantul/bouncing dari ujung kembali ke ujung.
Contoh kode:
<marquee behavior="alternate">TULISAN BERJALAN BOLAK-BALIK</marquee>
Hasil dari kode diatas:
Sekarang kita akan coba membuat variasi dari kode di atas. Kita akan membuat teks ini bergerak turun dan oleh karena itu kita perlu menambah kode height untuk membuat ruang pergerakan teks;
Contoh kode:
<marquee direction="down" height="100">TULISAN BERGERAK KE BAWAH</marquee>
Hasil dari kode diatas:
Membuat tulisan bisa berhenti jika dilintasi kursor/mouse
Anda dapat menambahkan scrip dibawah ini,
onmouseover="this.stop()" onmouseout="this.start()"
<marquee behavior="alternate" onmouseover="this.stop()" onmouseout="this.start()">TULISAN BERGERAK BOLAK-BALIK</marquee>
Hasil dari kode diatas:
Keterangan: Silahkan lintaskan kursor pada jalur ataupun teks untuk menghentikan pergerakan
Memberikan link pada tulisan berjalan
Anda bisa mengunakan kode berikut:
<marquee direction="down" height="100" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4">
TULISAN BERGERAK DENGAN LINK
</marquee>Hasil dari kode diatas:
Jenis huruf dan ukuran bisa diubah dengan menambahkan kode style="font-family: impact; font-size:24px; color: #cc0000;"
font-family: impact; adalah kode untuk mengubah jenis huruf. Jika anda tidak suka dengan font impact, silahkan diganti dengan Arial, Times New Roman, dan lain-lain
font-size:24px; adalah kode untuk mengatur ukuran huruf. Ubah nilai 24 sesuka hati anda. Semakin besar nilainya, maka semakin besar juga hurufnya.
color:#cc0000; adalah kode untuk mengatur warna huruf. Silahkan mengganti kode hex #cc0000 dengan nilai hex yang anda suka.
Contoh:
<marquee bgcolor="blue" style="font-family: impact; font-size:24px; color:#cc0000;" >TEKS FONT FAMILY LATAR KUNING FONT 24</marquee>
Hasil dari kode diatas:
Menggunankan marquee untuk gambar berjalan
Scrip yang digunakan sama dengan scrip tulisan berjalan hanya ada penambahan pada
Contoh:
<marquee direction="right"> <img src="http://www.4shared.com/download/gNnBM0Sjba/Blogger.jpg" /></marquee>
Keterangan: teks yang berwarna merah merupakan link dimana data/image tersimpanHasil dari kode diatas:
Demikian berbagai ragam cara untuk membuat teks dan gambar berjalan. Mudah-mudahan ini bisa menjadi alternatif bagi anda dalam menghias blog menjadi lebih menarik. Silahkan bereksperimen untuk meramu kode-kode di atas.
0 komentar:
Post a Comment