Teks berjalan, atau
running text bagi beberapa blogger
diperlukan untuk memberikan perhatian khusus mengenai esensi dari text
yang bersangkutan, contoh yang biasa mengunakan teks berjalan : "Gunakan
Mozilla Firefox untuk tampilan terbaik", "Peringatan!", "informasi
lebih lengkap silangkan kunjungi situs ini", dan lain-lain. Di antara
mereka ada yang menempatkan teks berjaan pada sidebar bahkan pada tilte
blog.
Pada postingan kali ini saya hanya akan menyempurnakan pembahasan sebelumnya mengenai
text berjalan dan text berkedip dengan HTML.
Sebelum melangkah lebih jauh cara penulisan teks berjalan dengan HTML,
ada baiknya saya jelaskan beberapa fungsi dari kode HTML yang terkait:
Cara penulisan teks berjalan harus diawali dengan tag <marquee>
dan diakhiri dengan </marquee>. Marquee sendiri memiliki beberapa
atribut diantarnya :
- Width : berfungsi untuk menentukan ukuran lebar yang nantinya
akan diapakai sebagai ruang teks berjalan. (dalam satuan pixel atau
persen).
- Height : berfungsi untuk menentukan ukuran tinggi ruang teks berjalan. (dalam satuan pixel atau persen).
- Direction : berfungsi untuk menentukan arah gerakan teks (left : teks berjalan ke arah kiri, right : teks berjalan ke arah kanan, up : teks berjalan ke arah atas, down : teks berjalan ke arah bawah.)
- Bevaior : berfungsi untuk mengatur gerakan teks terdiri dari 3 attribute yaitu (alternate : teks bergerak bolak balik, slide : teks bergerak satu arah dan hanya sekali setelah itu berhenti, scroll : teks bergerak satu arah berulang-ulang).
- Color : berfungsi untuk mengatur warna teks (ditulis dalam
kode hexadecimal tetapi untuk warna dasar bisa ditulis langsung sesuai
nama warna dalam bahasa Inggris). Sebaiknya pelajari dulu mengeni kode warna.
- Bgcolor : berfungsi untuk mengatur warna background (dalam
hexadecimal atau untuk warna dasar bisa ditulis langsung sesuai nama
warna dalam bahasa Inggris).
- <font face="kode HTML> ...... </font> : berfungsi untuk mengatur jenis font, warna font, ukuran font, dan sebaginya. Antara kode HTML dipisahkan dengan spasi)
- <span style="kode CSS"> ...... </span> : berfungsi untuk menyisipkan kode CSS di dalam HTML. Jika menggunkanan style maka atribut-atribut CSS dapat diterapkan di sini contohnya font-size : untuk mengatur ukuran font, font-weight: untuk mengatur ketebalan font, color : untuk mengatur warna font, dan sebagainya, penulisan kode CSS tersebut harus dipisahkan dengan tanda titik koma(;).
- Scrolldelay : berfungsi ntuk mengatur waktu tunda (delay) gerakan dalam satuan mili detik (ms).
- Scrollamount : berfungsi untuk mengatur kecepatan gerakan dalam satuan pixel.
- Loop : berfungsi untuk mengatur jumlah looping (pengulangan).
- Onmouseover="this.stop ()" : berfungsi untuk menghentikan teks berjalaan ketika mouse mendekat.
- Onmouseout="this.start ()" : berfungsi untuk membiarkan teks berjalan lagi ketika mouse menjauh.
Penulisan Kode HTML
dan CSS tersebut sebaiknya ditulis dalam huruf kecil semua.Untuk lebih
difahami silahkan perhatikan semua kode HTML dan CSS pada contoh-contoh
berikut :
Contoh 1 :
Kode HTML untuk membuat teks berjalan dari arah kanan ke kiri dengan
huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 20px,
lebar area 100% di atas backgroud biru adalah sebagai berikut :
Tampilan setelah diposting :
Contoh 2 :
Kode HTML untuk membuat teks berjalan dari arah kiri ke kanan dengan
huruf verdana, bold, warna biru, ukuran huruf 14px, tinggi area 20px,
lebar area 100% di atas backgroud kuning adalah sebagai berikut :
Tampilan setelah diposting :
Contoh 3 :
Kode HTML untuk membuat teks berjalan bolak-balik dari kan ke kiri
dengan huruf verdana, bold, warna kuning, ukuran huruf 14px, tinggi area
20px, lebar area 100% di atas backgroud biru adalah sebagai berikut :
Tampilan setelah diposting :
Contoh 4 :
Kode HTML untuk membuat teks berjalan dari atas ke bawah huruf arial,
bold, warna kuning, ukuran huruf 14px, tinggi area 70px, lebar area 100%
di atas backgroud biru adalah sebagai berikut :
Tampilan setelah diposting :
Contoh 5 :
Kode HTML untuk membuat teks berjalan dari bawah ke atas berulang-ulang
dengan huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area
70px, lebar area 100% di atas backgroud merah adalah sebagai berikut :
Tampilan setelah diposting :
Contoh 6 :
Kode HTML untuk membuat teks berjalan bolak-balik dari atas ke bawah
huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area 70px,
lebar area 100% di atas backgroud merah adalah sebagai berikut :
Tampilan setelah diposting :
Teks berjalan bolak-balik dari atas ke bawah
Contoh 7 :
Kode HTML untuk membuat teks berjalan dari bawah ke atas satu kali
setelah itu berhenti dengan huruf arial, bold, warna kuning, ukuran
huruf 14px, tinggi area 70px, lebar area 100% di atas backgroud biru
adalah sebagai berikut :
Tampilan setelah diposting :
Teks berjalan satu kali dari bawah ke atas setelah itu berhenti
Contoh 8 :
Kode HTML untuk membuat teks berjalan dari kanan ke kiri satu kali
setelah itu berhenti dengan; huruf arial, bold, warna kuning, ukuran
huruf 14px, tinggi area 20px, lebar area 100% di atas backgroud biru
adalah sebagai berikut :
Tampilan setelah diposting :
Teks berjalan dari kanan ke kiri lalu berhenti
Contoh 9 :
Kode HTML untuk membuat teks memantul berulang-ulang dari kanan ke kiri
dengan huruf arial, bold, warna kuning, ukuran huruf 14px, tinggi area
20px, lebar area 100% di atas backgroud biru adalah sebagai berikut :
Tampilan setelah diposting :
Teks memantul berulang-ulang
Contoh 10 :
Kode HTML untuk membuat teks link dimana teks tersebut berjalan dari
bawah ke atas dan akan berhenti setelah mouse didekatkan. Jika link
tersebut di-click, maka halaman yang bersangkutan akan terbuka adalah
sebagai berikut :
Tampilan setelah diposting :
Cara membuat Texarea
Penggunaan ID dan CLASS
Syntax Highlighter untuk Blogger
Efek Kertas Lipat
Efek bayangan
Catatan Penting :
- #FFFF00 adalah kode keksadesimal untuk warna kuning, 0#FF000 adalah
kode heksadesimal untuk warna merah, #FF0000 adalah kode heksadesimal
untuk warna mwrah dan seterusnya. Lebih lengkapnya dapat dilihat pada
artikel sebelumnya mengenai kode warna.
- Font-family : untuk menentukan jenis huruf seperti Arial, Verdana, Georgia dan lain-lain.
- Font-size : untuk mengatur ukuran huruf dalam satuan pixel (px) atau em.
- Pada Contoh 10, <a href="http://www.linksukses.com/2010/01/penggunaan-id-dan-class.html">Penggunaan ID dan CLASS</a><br/> kode dengan warna merah bisa diganti dengan URL milik anda dan title yang sesuai dengan URL tersebut.
- Font-Weight : untuk menentukan ketebalan huruf (bisa disi dengan angka 100, 200,...800, atau dengan bold).
- Scrolldelay : diisi dengan angka untuk mengatur kecepatan gerakan.
- Width untuk space teks berjalan dapat ditulid dengan angka
(pixel/px) dan dapat juga dengan menggunakan persentasi (%) yang
nantinya akan menyesuaikan dengan lebar wrapper atau layout postingan
blog anda.