Membuat Tulisan Dan Gambar Berjalan Di Blog

Membuat Tulisan Dan Gambar Berjalan Di Blog - Kebutuhan mendesain dan mempercantik Blog memang tidak pernah ada habisnya . Selalu ada yang baru dan selalu menarik untuk dicoba . Untuk materi posting kali ini sebenarnya adalah materi lama , mungkin lama sekali , yakni tentang Marquee yang sudah banyak sekali pembahasan mengenai hal ini .
Tapi tidak ada salahnya kita bahas ulang , karena mungkin saja masih ada pemula yang butuh panduan untuk membuat text atau gambar berjalan .

Pengenalan Marquee
Marquee berfungsi membuat text berjalan entah itu ke kiri , kanan , bawah , atas . Kelebihan dari memakai marquee sendiri adalah kita bisa menghemat ruang widget . Semisal anda memiliki widget produk di sidebar , karena produk yang ingin anda tampilkan banyak pasti butuh ruang yang besar . Dengan marquee ini tempat kecilpun akan muat karena konten produk anda bergantian tampil secara otomatis ( berjalan ) .

Namun kekurangan dari marquee juga tentu ada , yakni saat halaman blog belum ter-load sempurna maka seluruh konten akan tampil bahkan bentrok dengan konten lain . Namun ketika halaman ter-load sempurna akan kembali normal .

Marquee memiliki beberapa attribute yang bisa kita gunakan untuk mempercantik tampilan konten , bebrapa diantaranya ada dibawah ini .

• bgcolor : Atribut ini digunakan untuk mengatur background dari text yang akan diberi efek marquee.
• direction : Digunakan untuk mengatur gerakan dari text tersebut (up, down, left right).
• scrollamount : Untuk mengatur kecepatan dari gerakan text (angka dalam px), semakin tinggi angka yang digunakan, maka akan semakin cepat gerakan dari textnya.
• behaviour : Untuk mengatur efek dari gerakannya (slide, scroll, alternate).
• width : Untuk mengatur lebar dari area text nya (dinyatakan dalam px atau %).
• height : Untuk mengatur tinggi dari area text nya (dinyatakan dalam px atau %).
• align : Untuk mengatur posisi (center, left, right).
• onmouseover : Untuk memberhentikan efek ketika disorot (hover) mouse.
• onmouseout : Untuk melanjutkan efek bila mouse sudah tidak menyorot (hover) text.

Sebenarnya masih banyak atribut lain yang bisa digunakan , namun atribut diatas adalah atribut yang sering digunakan dalam penggunaan marquee.
Sekarang kita coba membuat text dengan gaya marquee .

Contoh penerapan marquee

Untuk contoh pertama kita akan membuat text berjalan ke arah kanan , untuk itu kita gunakan

<marquee direction="right">Contoh text berjalan ke kanan</marquee>

Contoh text berjalan ke kanan
Contoh marquee berjalan ke kiri

<marquee direction="left">Contoh text berjalan ke kiri</marquee>

Contoh text berjalan ke iri

Contoh marquee dari atas ke bawah

<marquee direction="down" scrollamount="2" height="100" width="50%"> Contoh Marquee dari atas ke bawah </marquee>

Contoh Marquee dari atas ke bawah

Contoh marquee dari bawah ke atas

<marquee direction="up" scrollamount="2" height="100" width="50%"> Contoh Marquee dari bawah ke atas</marquee>

Contoh Marquee dari bawah ke atas

Untuk membuat marquee bergerak labih kiri dan kanan

<marquee direction="left" behavior="alternate">Labil Kiri kanan </marquee>

Labil Kiri kanan
Contoh marquee berhenti ketika di sorot mouse

<marquee direction="down" scrollamount="2" onmouseover="this.stop()" onmouseout="this.start()" height="100"> Contoh marquee berhenti bergerak ketika di sorot mouse dan bergerak kembali ketika sudah tidak di sorot </marquee>

Contoh marquee berhenti bergerak ketika di sorot mouse dan bergerak kembali ketika sudah tidak di sorot
Itu beberapa contoh marquee text dengan atribut yang berbeda beda . Anda masih bisa bereksplorasi lebih jauh dengan marquee ini , silahkan bereksperimen dengan marquee text ini .

Untuk marquee pada gambar sebenarnya tidak berbeda dengan membuat tulisan berjalan , yakni masih mengunakan marquee dan atribut yang sama .

Kita buat satu contoh Gambar berjalan

<marquee direction="right"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCG0I9sHAkAIY1-4sllbuUEQSBGDmA4VbAIvUThzwDo7WFDIJZVn3kzWcIslCwn82QuxCBfrcEZ_3AmC1Ds8aPMrtoi6I1LwL2OtON2ToTXtmkk3Zez4RYLr9CZgLEeJ6rJVlzitXadkc/s1600/goblogination.png" /></marquee>

Ya itu merupakan contoh penggunaan marquee efek untuk text dan juga gambar . Anda masih bisa mengembangkan tekhnik ini , mmm semisal saja anda ingin membuat blog anda berjalan dari kiri ke kanan atau dari atas ke bawah atau sebaliknya , atau anda ingin membuat blog anda labih goyang goyang bikin para pembaca stress ?

Silahkan dicoba dan selamat berkreasi.

Dan pertemuan kita kali ini selesai sampai disini dalam pembahasan Cara Membuat Tulisan dan Gambar Berjalan yang semoga saja bermanfaat untuk anda . Salam .