Membuat Teks Berjalan (Marquee)
Sebelumnya nggak pernah kepikiran untuk bikin tips seperti ini kalo saja Iman my little brother nggak minta bikinin tutorial marque. Sebenarnya saya ragu, bener nggak seorang yang pinter blog seperti Iman yang mempunyai template bagus minta saya bikinin tutorial marquee? Lagian bahasa html memang paling rawan untuk orang seusia saya, masih hijau lumut 
Tapi ya apa salahnya sih sekedar berbagi, yang jelas ini bukan tutorial lho, hanya sekedar tips memaksimalkan kemampuan, keindahan serta teks pada postingan atau pun sidebar blog Anda.
Apa itu Marquee?
Marquee adalah teks berjalan dalam bahasa html. Kalo kita lihat marquee menurut semantik sepertinya ga ada hubungan dengan teks berjalan, tapi kalo diperhatikan lagi… mmmmh memang ga ada hubungannya ^_^ (sepertinya). Tapi kalo kita mau perhatikan lebih dalem, Marquee mempunyai arti “Tenda Besar,” atau “tempat berteduh seperti atap dimuka pintu masuk sebuah gedung” Mmmmh… apa hubungannya dengan marquee sebagai teks berjalan…? Setidaknya menurut saya memang ada, melalui “tenda” tersebut orang lalu lalang berjalan.
Berikut ini contoh-contoh sebagian kecil penggunaan marquee pada teks. Sengaja marquee-marquee di bawah ini saya beri title mulai marquee 1.0 sampai 3.0.3, tidak ada keistimewaan dari penamaan tersebut, hanya untuk memudahkan saya dalam memberi penjelasan. Plus tambahan saya sertakan kode html yang diperlukan, Anda tinggal mengganti teks yang ada dalam kode tersebut “Teks Anda”.
Marquee 1.0
Marquee 1.0 ini merupakan marquee standar agar teks Anda bisa berjalan secara default (dari kanan ke kiri).
Tag Html
<marquee>Teks Anda</marquee>
Marquee 1.0.1
Marquee 1.0.1 adalah pengembangan dari 1.0, keistimewaannya jika Anda arahkan mouse pada teks tersebut maka dia akan istirahat dan berhenti dari perjalanannya yang panjang.
Tag Html
<marquee onmouseover="this.stop()" onmouseout="this.start()">Teks Anda</marquee>
Marquee 1.0.2
Marquee 1.0.2 jika Anda menggunakan teks Arabic yang dimulai dari kanan ke kiri, maka Anda membutuhkan Marque ini yang berjalan sebaliknya; dari kiri ke kanan, contoh dengan teks arabic:
Tag Html
<marquee direction="right">Teks Anda</marquee>
Marquee 2.0
Marquee 2.0 Marquee ini tidak memiliki kemampuan magic seperti David Coperfield marquee sebelumnya yang bisa menembus ruang, Marquee 2.0 ini kerjaannya bolak-balik dari ruang kotak yang kasat mata.
Tag Html
<marquee behavior="alternate">Teks Anda</marquee>
Marquee 2.0.1
Marque 2.0.1 Pengembangan dari marquee sebelumnya, dengan pancingan scrollamount dia menjadi sangat agresif
Tag Html
<marquee behavior="alternate" scrollamount="18">Teks Anda</marquee>
Marquee 2.0.2
Marquee 2.0.2 Masih pengembangan dari Marquee 2.0 dengan sentuhan on-mouse-over stop dan on-mouse-out start, seperti marquee 1.0.1 jika Anda arahkan mouse pada teks maka dia akan berhenti.
Tag Html
<marquee behavior="alternate" onmouseover="this.stop()" onmouseout="this.start()">Teks Anda</marquee>
Marquee 3.0
Marquee 3.0 Dia adalah marquee climbing, marquee pendaki ini suka sekali ketinggian, sehingga kita lihat arah teksnya pun ke atas (up) . Jika Anda memiliki teks yang banyak, maka marquee ini merupakan pilihan yg tepat dan sangat cocok sebagai teman pendamping hidup Anda.
Tag Html
<marquee direction="up">Teks Anda</marquee>
Marquee 3.0.1
Marquee 3.0.1 Pengembangan dari marquee sebelumnya yang tidak mempunyai batas ruang, marquee ini kita batasi ruang kasatnya sehingga memliki height 100 saja. Demikian dengan kemampuan scrollamountnya kita perlambat. Dan kita kasih on mouse stop/start juga.
Tag Html
<marquee direction="up" onmouseover="this.stop()" width="100%" scrollamount="2" onmouseout="this.start()" height="100">Teks Anda</marquee>
Marquee 3.0.2
Marquee 3.0.2 Masih pengembangan dari marquee sebelumnya, hanya saja teks berada di tengah ruang kasat.
Tag Html
<marquee direction="up" width="100%" scrollamount="2" height="100" align="center">Teks Anda</marquee>
Marquee 3.0.3
Marquee 3.0.3 Pengembangan juga dengan arah berlawanan dari marquee sebelumnya, marquee ini senang sekali berjalan menurun. Sehinggan teks yang kita lihat berjalan dari atas ke bawah. Kemampuan scrollamountnya tidak kita batasi sehingga terlihat agresif dengan ruang kasat yang kecil. Silahkan Anda perlambat sendiri.
Tag Html
<marquee direction="down" width="100%" height="100">Teks Anda</marquee>
Demikian tips sederhana ini, silahkan Anda coba….! Jika ingin manambahkan marquee yang lain silahkan tulis komentar.
Keep Blogging ^_^
Popularity: 11% [?]
Category Contoh Teks HTML, TipsRelated Post:
Saya Hakimtea, salah satu dari sekian banyak Blogger Indonesia tinggal di Bandung. Blog ini merupakan Blog "pribadi" yang membahas seputar blog dan lainnya.
Makasih ya tips/tutorialnya…..
btw yg tulisan arabicnya artinya apaan?? yg kubaca
yang tengah itu artinya,
Istilah artikelnya unik>>>>”Tenda Besar,” atau “tempat berteduh seperti atap dimuka pintu masuk sebuah gedung.he..he..
btw tips yang penting buat rekan2 yg lom faham.
Makasih mba KD
nemu artinya emang seperti itu dari linguist 
Saya cantumkan karena seperti Anda bilang, saya pun merasa unik 
saya kaget loh…kok ada artikel tutorial marque tapi it’s worth lho…. pasti beguna,buktnya yg posting pun banyak
jadi kepikran maw edit CA_line nya mas cosa pake marque…
Wah mas arham ternyata, jadi malu saya…
ya kemaren waktu posting ini, sengaja ga mau nyapa dulu neng google… biar pure! krn saya yakin yg bikin posting ini pasti udah banyak. Trnyata stlh publish waktu nanya si neng… bener ajah 
lumayan urutan 6-8 dari 60-720 hasil pencarian dgn keyword “membuat teks berjalan”
artikel yang bermanfaat. thanks dah mau nulis soal marquee. Kalau isinya banner bisa nggak ya?
Isi banner bisa saja mas Bizon, namun lebih baik ukuran bannernya yg agak lebar (min 468 width, kurang dikit gpp, bungkus). Dari tulisan saya ttg Membuat Banner Blog trus dari photoshop edit di ImageReady dgn sentuhan akhir Tween disebelah tombol Duplicates frame layer pada jendela animation, setting saja frames to addnya. Met mencoba mas Bizon!
Sukses dgn adsense, SEO dan MMOnya…
jgn lupa bagi2 ilmunya ^_^
Mas bagaimana jika ditaruh di blogku (samping kanan) sebagai link blog kawanku yang berjalan ke atas . thank you makasih ya tak tunggu loh
Dede: pake aja Marquee 3.0.1 tinggal diganti teksnya dengan link yang ada, contoh:
<marquee direction="up" onmouseover="this.stop()" width="100%" scrollamount="2" onmouseout="this.start()" height="100">Teks Anda</marquee>ganti seperti ini,
<marquee direction="up" onmouseover="this.stop()" width="100%" scrollamount="2" onmouseout="this.start()" height="100"><a href="http://hakimtea.com">Hakimtea</a>
<a href="http://">link 1</a>
<a href="http://">link 2</a>
<a href="http://">link 3</a>
<a href="http://">link seterusnya</a>
</marquee>selamat mencoba
kim….blog ente mantap bener dech…
gua blajar banyak nich …maklum baru kenal blog…
tengkiu ya……salam kenal…
ha ha marquee … salah satu fitur favorit saya
weh, apik tnan mas. aku dah tak coba di blog Capoeira Solo. cman kalo mau modif font sama warnanya gimana ? thanks ya
makasih infonya mas
thanks tutorialnya mas..dah tak coba diblogku, tapi harus manual ya…soalnya kan di blogspot itu ada configure link, itu ga bis tuh dimasukin marquee, jadi aku bikin pake html aja, trus copy paste link blog nya manually, ribet siy, tp hasilnya cukup memuaskan.tenkyu mas hakim..sering2 bagi tips nya yaa…
mas kalo aku mo bikin marquee gimana ya caranya….coz blm mudeng ni masuk kemana dulu. thx
Met mencoba ya…
Tes Marque nih
Mas, saya ada masalah nih. ketika saya coba tampilkan di posting dan diantaranya di sidebar word pres, marque-nya tidak berfungsi. hanytampil kode-kode saja. apakah salah cara dan tempatnya atau bagai mana?
yang sudah saya coba: 1. di simpan di widget wordpress 2. di postingnya.
mohon pencerahannya dan terima kasih.
Teks Anda
Mantap mas…
Saya sangat terbantu dengan tutorialnya mas.
Saya mengucapkan banyak Terimakasih.
asslqmm..
mas,,, mau minta tolong neh,
Aku mw pasang bannernya logo friendster yg bisa langsung linki ke profil aku di Fs, but aku gak taw tag htmlnya. Buatin dunk mas…!
asslqmm..
mas,,, mau minta tolong neh,
Aku mw pasang bannernya logo friendster yg bisa langsung linki ke profil aku di Fs, but aku gak taw tag htmlnya. Buatin dunk mas…!
Kalo udah, simpan di chat box aq, ato konkan aja di artikel blog, ato kirik ke shadow.red1@gmail.com
thanks before
mas ko ga bisa yah,, dah di coba
saya pake WP klo kode yg lain bisa ?????????????
http://www.faisal08.tk
jazakallah ,marqueenya bunda lis jadi ngerti kalau untuk beberapa foto gimana caranya
Tank bawa kayu..
Thank you…
ajarin buat banner berjalan di M.flash 8 bsa ga?
-buat poster di adobe cs..
-memassukan banner ke dlam blog wordpass
-buat web pke dreamweaver jg dung…
thx…
MANTAP DAH!!!
AKU COBA DEH MAS…
makasih atas kode yah…
mantap2
wah ini yang kucari-cari. makasih .
thanks for info
Terima kasih tutorialnya, menambah ilmu…
Makasih lagi setelah tema & logo HUT RI 64 saya dapet lagi tentang bikin tema jalan. Semoga banyak rezekinya.
nice post. cuma satu lagi yang perlu di tambah yaitu marquee yang berjalan ke atas, kemudian berhenti sejenak atau beberapa detik, kemudian jalan lagi, berhenti lagi, jalan lagi. tq semoga bermanfaat
thanks infonya !!
keren, tkas n teruskan perjuangan mu mencerdaskan anak bangsa
Wah lengkap buanget tutorial markiu-nya. Btw, gudlak dengan semua kontes SEO yang diikuti ya mas.
Aq dah nyoba trnyata berhasil. Thanx yah. Btw, bisa kasih postingan ttg penggunaan readmore? Cz aq ga pernah berhasil dlm hal itu.. Tolong aq yah…
thank ya. Semoga Allah memudahkan kita dalam setiap gerak langkah kita.
salam
Makasih tips-tipsnya yaa..
jadi semangat untuk belajar niih..
bgus,,,]
blog ku jadi keren dah…