Contoh Tulisan Berjalan / Marquee Standar
Untuk menciptakan Tulisan Berjalan menyerupai diatas, kita memerlukan arahan html menyerupai dibawah ini :
<marquee>Contoh Teks Yang Dikenai Marquee</marquee>
Si <marquee> inilah yang nantinya akan menciptakan seluruh Tulisan atau Teks yang diapit arahan tersebut sanggup bergerak.
Yang diatas itu kan Tulisan Berjalan yang lazim saja tanpa suplemen pengaruh apapun pada arahan html. Kita pun sanggup memvariasikan kode <marquee> diatas dengan JavaScript atau HTML yang lain, biar lebih terperinci kita masuk rujukan saja.
Cara Menambahkan Warna Background di Tulisan Berjalan
Untuk menyertakan warna background, kita perlu menyisipkan style="background: warna;"kedalam arahan marquee-nya, dibawah ini yakni rujukan bila kita ingin memberi warna abu-abu pada Marquee Text.
<marquee style="background: gray;">Contoh Teks Yang Dikenai Marquee Dengan Background Abu-abu</marquee>
Maka hasil dari arahan HTML diatasa akan nampak menyerupai ini.
Tulisan Berjalan diatas sulit untuk dibaca bukan ? kita juga sanggup merubah warna dari Teks diatas, biar kontras dengan backgroundnya.
Cara Mengganti Warna Tulisan Berjalan
Disini saya akan mencotohkan bagaimana merubah warna Tulisan Berjalan diatas dengan warna Putih biar teks tersebut mudah untuk terbaca.
Kode yang kita pakai yakni menyerupai ini :
<marquee style="background: gray; color: white;">Contoh Teks Yang Dikenai Marquee Dengan Background Abu-abu Teks Putih</marquee>
Dan Hasilnya akan nampak menyerupai dibawah ini :
Cara Membuat Tulisan Berjalan Setengah Layar
Selain merubah warna dan juga background kita juga sanggup menciptakan Tulisan Berjalan tersebut cuma tampil dari tengah, tidak full dari kanan ke kiri.
Dan cara ini tergantung dari Div atau Nav pembungkus Marquee Teks tersebut, artinya bila lebar selector Div cuma 500px maka Tulisan berlangsung akan timbul pada pixel ke 250 - 0 (tengah ke kiri).
Contoh penerapan dalam arahan HTML :
<marquee width="50%">Contoh Teks Yang Dikenai Marquee Width 50%</marquee>
Kode HTML diatas akan menciptakan goresan pena 'Contoh Teks Yang Dikenai Marquee' akan berlangsung dari tengah-tengah layar menuju ke kiri, atau lebih jelasnya menyerupai rujukan dibawah ini :
Dan Anda pun bebas merubah persentase tersebut. Semakin kecil maka kian ke kiri pula teks yang mau tampil.
Diatas kita cuma menggunakan HTML dan CSS bukan, nah kini kita akan menyertakan JavaScript kedalam kode <marquee> tersebut.
Cara Membuat Tulisan Berjalan Dengan Jeda
Jika normalnya Tulisan Bejalan atau <marquee> selalu berlangsung tanpa henti dari kanan ke kiri, maka kita sanggup menyuruhnya untuk berhenti sejenak (jeda) dengan cara menyertakan arahan berikut.
<marquee scrolldelay="500">Contoh Teks Yang Dikenai Marquee Scrolldelay 500</marquee>
500 disini tujuannya yakni 0,5 Detik bukan 500 Detik. Makara arahan diatas bila dilakukan akan menciptakan Teks yang ada didalam kode <marquee></marquee> berhenti sejenak setiap 0,5 Detik.
Contohnya menyerupai dibawah ini :
Cara Mengatur Kecepatan Tulisan Berjalan
Walaupun tolok ukur dari Marquee Text sudah sesuai (tidak terlalu cepat atau lambat) tetapi bila Anda merasa Tulisan Berjalan tersebut begitu amat cepat, Anda sanggup dengan mudah mengendalikan kecepatannya, yakni dengan menambahkan scrollamount="angka"
Contoh penerapan dalam HTML :
<marquee scrollamount="10">Contoh Teks Yang Dikenai Marquee Dengan Speed Scroll Amount 10</marquee>
Dan arahan tersebut akan menciptakan pengaruh menyerupai ini :
Saya sendiri tidak tahu persis makna dari angka 10 tersebut, apakah 10px per detik atau apalah saya kurang tahu, Tapi yang terperinci bila Anda merubah angkanya menjadi lebih besar, maka Kecepatan Tulisan Berjalan tersebut akan makin cepat.
Cara Membuat Tulisan Berjalan Dari Kiri ke Kanan
Seperti yang kita semua tahu, bahwa Standar dari Teks Berjalan yakni mengarah Dari Kanan ke Kiri. Namun kali ini kita akan menjajal hal yang berlawanan yakni membalikkan arah pergerakannya (kiri ke kanan).
Kode HTML suplemen yang kita perlukan adalah direction="right" yang nanti akan kita pasangkan dengan <marquee> tentunya.
Contoh penggabungan :
<marquee direction="right">Contoh Tulisan Berjalan Dari Kiri ke Kanan</marquee>
Dan kesudahannya akan menjadi menyerupai ini :
Cara Membuat Tulisan Berjalan Memantul
Agar Tulisan Berjalan tersebut sanggup memantul, kita cukup menambahkan behavior="alternate".
Contoh penambahan ke dalam HTML :
<marquee behavior="alternate">Contoh Tulisan Berjalan Dengan Efek Memantul</marquee>
Hasilnya setelah kita terapkan :
Cara Membuat Tulisan Berjalan Dari Bawah ke Atas
Sebenarnya arahan untuk menciptakan Tulisan Berjalan Dari Bawah ke Atas sama saja dengan dengan Cara Membuat Tulisan Berjalan Dari Kiri ke Kanan, cuma saja kita merubah valuenya menjadi direction="up"
Contoh penerspan :
<marquee direction="up">Contoh Tulisan Berjalan Dari Bawah ke Atas</marquee>
Dan Hasilnya :
Kata "up" juga sanggup Anda ganti dengan down (untuk memberi pengaruh goresan pena berlangsung dari atas ke bawah).
Cara Membuat Tulisan Berjalan Berhenti Ketika Disentuh Oleh Kursor Mouse
Membaca dalam keadaan teks sedang berlangsung memang saya akui cukup sulit, nah untuk itu ada arahan JavaScript (JS) untuk memecahkan duduk kendala tersebut, yaitu onmouseover="this.stop()" onmouseout="this.start()" kode JS tersebut fungsinya untuk menghentikan laju Tulisan Berjalan tersebut, dengan catatan ada Kursor Mouse yang melalui atau bersinggungan dengan Tulisan Berjalan.
Contoh Penggabungan JavaScript diatas dengan arahan HTML Marquee :
<marquee onmouseover="this.stop()" onmouseout="this.start()">Contoh Teks Yang Dikenai Marquee Dan Akan Berhenti Jika Ada Kursor Diatasnya</marquee>
Dan hasil dari kerja sama JavaScript dan HTML diatas yakni menyerupai dibawah ini :
| Cara Memasang Kode Marquee di Dalam Artikel | Cara Memasang Kode Marquee di Dalam Widget |
|---|---|
| 1. Masuk ke dalam Text Editor, kemudian pilih Mode HTML 2. Copy dan Paste arahan Marquee Anda disini 3. Beralihlah ke Mode Compose (jika sukses text 4. akan berjalan) 4. Untuk memutuskan arahan berlangsung tepat klik pada Pratinjau | 1. Masuk ke dalam hidangan Tata Letak kemudian Klik Tambahkan Gadget 2. Pilih pilihan HTML/JavaScript 3. Copy dan Paste arahan Marquee pada textare yang sudah disediakan 4. Klik Simpan dan silahkan dilihat hasilnya |
Sebenarnya masih banyak variasi-variasi yang sanggup kita kerjakan dengan <marquee> ini. Kalau sempat nanti niscaya postingan cara menciptakan goresan pena berlangsung ini nantinya akan saya Update, jadi jangan sungkan-sungkan untuk membookmark halaman ini untuk mendapat update.an modern ihwal cara menciptakan goresan pena berjalan, hhe.
0 Komentar untuk "Cara Buat Goresan Pena Berjalan"