CARA MEMBUAT TEKS BERJALAN DI BLOG
Berikut langkah - langkah yang harus dilakukan :
Masuk ke dasbor blogger.
Buat posting / laman baru.
Tulis isi seperti biasanya sampai selesai.
Ganti mode penulisan dari Compose menjadi HTML (gambar ada di bawah).
Pasang kode html tulisan berjalan pada posisi yang sobat mau.
Untuk meyakinkan apakah tulisan sudah berjalan sesuai keinginan silakan pratinjau dahulu.
Kalau sudah berjalan dan posisinya sudah pas, silakan terbitkan.
Selesai.
- SATU KLIK MENUJU WEB CYBERFIFHACK
- SEGERA DOWNLOAD APLIKASI CYBERFIFHACK
- LINK ADA DI BAWAH
- CLICK DI SINI UNTUK DOWNLOAD
- Baca juga
- 12+ APLIKASI VPN TERBAIK 2018
Mana kode yang akan membuat tulisan berjalannya mas?...
Sabar.... Nanti sobat akan menemukannya di bawah.
MEMASANG KODE YG DI COPY
Kita juga dapat memasangnya pada gadget blogger. Berikut langkah-langkahnya :
Masuk ke blogger.
Buka halaman Tata Letak.
Klik Tambahkan Gadget Baru.
Pilih gadget HTML/JavaScript.
Masukkan tulisan berjalan pada bagian konten.
Pastikan sobat melihat tulisan Rich Text (gambar ada di bawah)
Simpan .... Selesai.
SELAIN 2 CARA DI ATAS, kita juga dapat menyisipkan tulisan berjalan langsung pada template yang digunakan jika mau.
Oke... mari kita lanjut ke pembuatan kode.
Sebenarnya untuk membuat tulisan berjalan kita hanya memerlukan 1 tag html, yaitu <marquee> (pembuka) dan </marquee> (penutup).
Misalnya kita ingin membuat teks "Salamat Datang Di Blog Saya" menjadi berjalan.
Maka kita dapat menulis teks tersebut terlebih dahulu baru mengurungnya dengan kode <marquee> dan </marquee>.
Atau menulis kode <marquee> dan </marquee> dahulu baru menyisipkan teks di antara keduanya.
Hasil kode seharusnya jadi seperti ini
HTML
<marquee>Salamat Datang Di Blog Saya</marquee>
Dan hasil di blog akan terlihat seperti ini
Salamat Datang Di Blog Saya
ITU kode yang paling sederhana yang secara default akan menampilkan tulisan berjalan dari kanan ke kiri.
Kita dapat membuatnya berjalan dari kiri ke kanan dengan menambahkan sedikit atribut direction="right" pada tag pembuka seperti ini
HTML
<marquee direction="right">Salamat Datang Di Blog Saya</marquee>
Maka hasilnya akan menjadi seperti ini
Salamat Datang Di Blog Saya
Kita juga dapat MEMBUATteks bergerak dari atas ke bawah atau sebaliknya.
Membuat teks bergerak dari bawah ke atas
Kode
HTML
<marquee direction="up">Salamat Datang Di Blog Saya</marquee>
Hasil
Salamat Datang Di Blog Saya
Membuat teks BERGERAK dari atas ke bawah
Kode
HTML
<marquee direction="down">Salamat Datang Di Blog Saya</marquee>
Hasil
Salamat Datang Di Blog Saya
Apakah kecepatan teks berjalan dapat di atur?....
Bisa sob.... Yaitu dengan cara menambahkan atributscrollamount="nilai". Yang mana nilai dapat kita tulis dengan angka 1, 2, 3, dst...
Secara default kode <marquee> sudah memiliki nilai scrollamount 6 atau sama dengan scrollamount="6". Jadi kita harus menggunakan angka 6 ke bawah atau ke atas.
Apabila angka yang kita gunakan di bawah dari angka 6, maka tulisan berjalan akan lebih lambat. Sebaliknya, kalau yang kita gunakan di atas dari 6, maka teks akan semakin cepat.
Cara penulisan seperti ini
HTML
<marquee scrollamount="9">Contoh Tulisan Berjalan</marquee> <marquee>Contoh Tulisan Berjalan</marquee> <marquee scrollamount="6">Contoh Tulisan Berjalan</marquee> <marquee scrollamount="3">Contoh Tulisan Berjalan</marquee>
Hasil
Contoh Tulisan Berjalan
Contoh Tulisan Berjalan
Contoh Tulisan Berjalan
Contoh Tulisan Berjalan
Kalau dari kiri ke kanan seperti ini kodenya
HTML
<marquee scrollamount="8" direction="right">Contoh Tulisan Berjalan</marquee> <marquee direction="right">Contoh Tulisan Berjalan</marquee> <marquee direction="right" scrollamount="2">Contoh Tulisan Berjalan</marquee>
Hasil
Contoh Tulisan Berjalan
Contoh Tulisan Berjalan
Contoh Tulisan Berjalan
Kalau ingin membuatnya bergerak dari bawah ke atas atau sebaliknya silakan ganti direction="right" jadidirection="up" ataudirection="down".
Membuat Tulisan Bergerak Bolak Balik
Untuk membuat teks berjalan tersebut jadi bolak balik / memantul / mondar mandir. Maka kita harus menambahkan atributbehavior="alternate" pada tag pembuka, seperti ini :
HTML
<marquee behavior="alternate">Salamat Datang Di Blog Saya</marquee>
Hasil
Salamat Datang Di Blog Saya
Silakan tambahkan atribut lainnya seperti untuk mempercepat / lambat teks, membuatnya berjalan dari kiri, atas, atau bawah.
Membuat teks bergerak diagonal / zig zag
Kode yang digunakan
HTML
<marquee direction="up" align="center" behavior="alternate"><marquee direction="right" behavior="alternate">Salamat Datang Di Blog Saya</marquee></marquee></marquee></marquee>
Hasil
<< Salamat Datang Di Blog Saya
Salamat Datang Di Blog Saya >>
Tulisan Berjalan Secara Berlawanan
Kode yang digunakan
HTML
<marquee width="50%"><< Salamat Datang Di Blog Saya</marquee><marquee direction="right" width="50%">Salamat Datang Di Blog Saya >></marquee>
Hasil
<< Salamat Datang Di Blog Saya
Salamat Datang Di Blog Saya >>
Membuatnya berhenti berjalan ketika kursor di arahkan ke teks berjalan
Untuk membuatnya berhenti ketika kursor di arahkan ke tulisan, kita cukup menambahkan kodeonmouseover="this.stop()" onmouseout="this.start()" pada tag pembuka.
Maka kalau ditulis jadi seperti ini
HTML
<marquee onmouseover="this.stop()" onmouseout="this.start()">Salamat Datang Di Blog Saya</marquee>
Hasil
Salamat Datang Di Blog Saya
Cara Memberi Warna Pada Teks Berjalan
Kita juga dapat mewarnai tulisan berjalan tersebut dengan menambahkan style seperti ini
HTML
<marquee style="background:#FF0000;color:#FFFFFF">Salamat Datang Di Blog Saya</marquee>
Hasil
Salamat Datang Di Blog Saya
background:#FF0000 adalah yang membuat latar menjadi merah
color:#FFFFFF yang membuat tulisan menjadi putih
Untuk mengubah warna silakan ganti kode warna #FF0000 dan #FFFFFF dengan warna lainnya. Silakan buka halaman List Kode Warna CSS/HTML Lengkap.
Membuat Gambar Berjalan Menggunakan Kode Marquee
Selain teks, kita juga dapat menggunakan<marquee> untuk membuat gambar berjalan.
Caranya sebenarnya sama saja dengan membuat tulisan berjalan, bedanya cuma teks diganti dengan gambar.
Penulisan kode seperti ini
HTML
<marquee>Tulis kode gambar di sini</marquee>
- >>>>>>>>>>
0 komentar:
Posting Komentar