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 adalah teks berjalan lho #2
Marquee adalah teks berjalan lho #3
Marquee adalah teks berjalan lho #4
Marquee adalah teks berjalan lho #5
Marquee adalah teks berjalan lho #6
Marquee adalah teks berjalan lho #7
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 adalah teks berjalan lho #2
Marquee adalah teks berjalan lho #3
Marquee adalah teks berjalan lho #4
Marquee adalah teks berjalan lho #5
Marquee adalah teks berjalan lho #6
Marquee adalah teks berjalan lho #7
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 adalah teks berjalan lho #2
Marquee adalah teks berjalan lho #3
Marquee adalah teks berjalan lho #4
Marquee adalah teks berjalan lho #5
Marquee adalah teks berjalan lho #6
Marquee adalah teks berjalan lho #7
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 adalah teks berjalan lho #6
Marquee adalah teks berjalan lho #5
Marquee adalah teks berjalan lho #4
Marquee adalah teks berjalan lho #3
Marquee adalah teks berjalan lho #2
Marquee adalah teks berjalan lho #1
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 ^_^
______________
Kampanye Damai Pemilu Indonesia 2009
Popularity: 23% [?]
Related posts :
- Coret Tulisan, Tulisan Akronim, Dll Bagi pengguna wordpress untuk efek tulisan dicoret seperti ini tulisan
- Membuat Banner Blog Postingan ini atas permintaan Teuku Zulfikar Amin yang ingin membuat
- Menyamarkan Link Dalam Blog Trik ini sangat cocok buat rekan-rekan yang ingin memasang link
- Membuat & Menyisipkan Tabel HTML di Postingan Blogger Bagi Anda pengguna Ms Office; baik itu excel ataupun MS
- Sbobet dan BolaZoom.com Selintas melihat design website BoleZoom.com yang membahas masalah Sbobet terlihat
Hi, my name is Hakimtea, I like drink a cup of tea n blogging is really my cup of tea :) I've been dreaming to be a fulltime Blogger, I imagine to be a Master Blogger... when I wake up and realize that all my dreams are still like all I consume, an ordinary Hakimtea... a newbie Blogger who try to write, sharing information and getting money from blogging. 
March 9th, 2008 at 3:02 am
Makasih ya tips/tutorialnya…..
btw yg tulisan arabicnya artinya apaan?? yg kubaca مرقو ادلح تيكس برجالان “marquee adalah ….. berjalan” ga ngerti yg tengahnya…
sekali lg thank you mas tipsnya…..
sudah kucoba berhasil…
Wassalam,
March 9th, 2008 at 4:55 am
yang tengah itu artinya, تيكس : Teks… emang asal nulis, cari yg mirip2… ^_^
sama2 wa
March 9th, 2008 at 9:25 am
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.
March 9th, 2008 at 9:58 am
Makasih mba KD
nemu artinya emang seperti itu dari linguist 
Saya cantumkan karena seperti Anda bilang, saya pun merasa unik 
March 10th, 2008 at 1:38 pm
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…
March 10th, 2008 at 2:20 pm
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”
March 15th, 2008 at 10:53 pm
artikel yang bermanfaat. thanks dah mau nulis soal marquee. Kalau isinya banner bisa nggak ya?
March 16th, 2008 at 8:27 am
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 ^_^
April 23rd, 2008 at 2:45 pm
Mas bagaimana jika ditaruh di blogku (samping kanan) sebagai link blog kawanku yang berjalan ke atas . thank you makasih ya tak tunggu loh
April 23rd, 2008 at 11:22 pm
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
May 22nd, 2008 at 11:50 am
kim….blog ente mantap bener dech…
gua blajar banyak nich …maklum baru kenal blog…
tengkiu ya……salam kenal…
July 8th, 2008 at 3:02 am
ha ha marquee … salah satu fitur favorit saya
July 15th, 2008 at 7:03 am
weh, apik tnan mas. aku dah tak coba di blog Capoeira Solo. cman kalo mau modif font sama warnanya gimana ? thanks ya
July 23rd, 2008 at 11:02 am
makasih infonya mas
August 8th, 2008 at 11:01 pm
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…
August 9th, 2008 at 4:11 am
August 13th, 2008 at 2:50 pm
mas kalo aku mo bikin marquee gimana ya caranya….coz blm mudeng ni masuk kemana dulu. thx
August 13th, 2008 at 5:47 pm
Met mencoba ya…
August 27th, 2008 at 2:06 am
Tes Marque nih
August 29th, 2008 at 11:06 pm
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
September 2nd, 2008 at 12:04 am
Mantap mas…
Saya sangat terbantu dengan tutorialnya mas.
Saya mengucapkan banyak Terimakasih.
September 22nd, 2008 at 6:26 pm
Terimakasih mas tips-nya… Sudah saya coba di blog saya,dan BERHASIL.
terimakasih banged….
September 27th, 2008 at 9:58 am
mantap tutorialnya mas, sangat bermanfaat.
October 16th, 2008 at 12:15 pm
mas link sampeyan dah tak invite ke blog que.invite jg blog qoe ya?gak papa kan tukeran link?
October 26th, 2008 at 3:27 am
thx banget tutor2nya mas..oia gimana caranya biar judul web kita yang diatas mozilla/ brwser lain berjalan…
terimakasih
December 3rd, 2008 at 12:20 am
untuk marque ini dimasukan kemana mas apa di html/java sciprt atau di edit html pada bloqspot trims yah semoga selalu sukses, ditunggu jawabannya =)
December 12th, 2008 at 5:47 pm
masss…makasi ya tutorial nya….
semoga Alloh mengganti dengan pahala yang setimpal
“Ilmu yang baik itu adalah ilmu yang bermanfaat bagi orang lain”
December 12th, 2008 at 6:42 pm
@niwbie : jika di postingan maka gunakan edit html janga compose.
December 18th, 2008 at 7:26 am
wah bang makasih banget yach itu marquenya berhasil qw edit yach walaupun ngubah dikit….qw cuma perlu marquenya untuk buat gambar qw jalan
thanks yach bang…!!!!
December 18th, 2008 at 3:54 pm
Wah bagus banget Blog Mas hakimtea, Saya jadi iri kepingin buat juga, ada yg mau saya tanyakan kalau mau buat kalimt berkedip-kedip bagaimana caranya Mas Hakim, thnks atas perhatian dan bantuannya
December 18th, 2008 at 4:12 pm
selamat mencoba
December 31st, 2008 at 3:53 pm
Mas, kl untuk banner berjalan menyamping atau vertikal (bannernya lebih dri 2) gimana ya. Pernah lihat di salah satu blog teman.
Please help me ya
Thanks
January 3rd, 2009 at 12:23 pm
mantap mas. thank’s atas semua informasi dan panduannya.
January 5th, 2009 at 9:42 pm
Greit!! Ai nou u ken du more…..
January 17th, 2009 at 3:13 am
jual stocklot kualitas eksport dg harga terMurah, kunjungi kami, tks sebelumnya oom hakimtea dah numpang promosi..
January 24th, 2009 at 10:32 am
nice info….
January 25th, 2009 at 2:29 am
makasih pak hakim
. Marquee bolak-balik ma mouse roll over-nya sangat berguna sekali. Buat pengumuman di forum ayas…thx a lot
January 26th, 2009 at 1:25 pm
mas saya mo tanya ko da saya coba d friendster g jalan ya…..
d tunggu ya jawaban na…kalo bisa jawaban na d kirim k email q ja……
thanx ya….
January 26th, 2009 at 1:28 pm
mas saya mo tanya…
saya da coba di friendster saya ko g bisa ya…..
thanx ya….
January 26th, 2009 at 7:01 pm
saya bersyukur sekali hari ini “tersesat” di blog mas hakim…informatif bangett!!! terimakasih banyak, besok mau cangkul2 ilmu disini lagi ah **click bookmark**
February 5th, 2009 at 12:02 am
dapet ilmu baru nich, nyoba ah
makasih ya ?
Salam kenal buat semuanya
February 10th, 2009 at 5:26 am
terima kasih ni atas informasi nya
February 11th, 2009 at 3:09 pm
koq saya coba gak bisa mas
tlg donk
February 11th, 2009 at 3:23 pm
ohya, di multiply belum bisa ya mas?
February 12th, 2009 at 8:27 am
Salam kenal Bung! Wuih keren euy totornya, pasti berguna bagi yang membutuhkan, mampir yah ke webku. Trims.
February 14th, 2009 at 9:25 pm
Assalamu’alaikum
hai kang hakim ^_^
ternyata tutor ni masuk ke popular article….
ga nyangka…
ada nama saya nya lagi wkwkwk…
February 21st, 2009 at 6:12 pm
makasih infonya
tikus kalee
March 1st, 2009 at 4:07 pm
mas..berlaku untuk banner juga gak?
saya udah coba model Marquee 3.0.1 tapi gak bisa?adakah cara lainya?
tks mas hakimtea
April 15th, 2009 at 2:30 pm
1. Salam kenyal pak hakim (dan pak jaksa)
, nih perawannya datang.
2. Apakah marquee di atas juga bisa dipasang di WP?
3. Kalau boleh usul nih, gimana kalawo semua tips n triks tentang ngeblog itu di pdf-kan. Kan bisa buat referensi banyak blogger shg tidak perlu copy materi tinggal DL.
4. Lagi, akan lebih baik lagi kalawo diurutken, dan dijadikan ebook sekalian dimasukin ke penerbit buku, aku mau beli ah kalo ada, cos penjelasan pak Hakim sangat nuntut eh runtut.
5. Apasih maksud/7an adanya berbagai fasilitas rank blog/web itu? Apakah sekedar narsis-narsisan atawao apa pak?
6. Sekian, mohon mangap kalawo komengku yg msh perawan ini terlalu sedikit. Mantul nyuwun pak.
April 21st, 2009 at 8:48 am
Salam kenal Pak Hakim, makasih atas tutornya…..
May 2nd, 2009 at 4:52 pm
Salam Kenal…..Trimakasih atas Tutornya ya….
May 16th, 2009 at 5:28 pm
wah saya suka sekali dengan tutorial marquee nya ini kang. Sangat berguna coz saya juga suka dengan sesuatu yang unik dan marquee consideraly as on of the most unique effect. ijin untuk menyerap ilmunya ya kang Hakim.
May 20th, 2009 at 1:31 pm
good info. thanks
June 20th, 2009 at 10:31 am
“Kanh HAKIMTEA,kalo marquee,bisa ga buat WORDPRESS ??? Dan gimana cara pasangnya ??? Trim’s sblmnya, atas jawabannya…
July 22nd, 2009 at 6:30 pm
Tips yang sangat bagus. Saya berbulan-bulan mencari tips semacam ini sejak saya mulai nge-blog pada akhir tahun 2008 lalu. Trims
July 30th, 2009 at 3:14 pm
mas, lagi nyoba saran dari mas, neh. Hehehe. Makasih banyak ya, Mas. Postingan ini bermanfaat sekali
August 6th, 2009 at 2:53 pm
mohon dukungannya di kotes seo klik here
September 13th, 2009 at 8:29 am
asswrwb.
mas hakim yang baik hati…..
Tulisannya sangat membantu saya…..semoga Allah swt membalasnya, amin
October 9th, 2009 at 6:33 am
makasih atas infonya…!
October 14th, 2009 at 10:39 am
aku dah coba …
dan hasilnya bisa di lihat di http://www.iphincow.com
thank u
October 22nd, 2009 at 4:55 pm
saya mau naynkan bagaimana cara mebuat menu2 di blob saya ,contoh kalo saya daptar harga dan orang mengkliknya membuka ke link daptar harg tersebut,terima kasih
October 25th, 2009 at 11:42 am
http://sidiq-good-boy.blogspot.com/
My blog…………..kalian akan mendapatkan tutorial blog dan free software…….dll
December 9th, 2009 at 1:25 pm
ass. kang hakim…..
saya terus terang saja awam terhadap yg namanya komputer,apalagi web hosting,tlong di ksih tau bgaimana klo sy pngen bikin teks berjalan di web.
trim”s
December 11th, 2009 at 3:07 pm
Ass. bang hakim, saya sangat tertarik dengan tampilan blog-blognya, saya kepingin belajar hal itu utk disebarkan pada blog saya majelis ta’lim nurul amin. insya allah abang bisa bantu kami menyebarluaskn info tentang kami di daerah ini. wassalam.
December 17th, 2009 at 2:52 pm
Marquee ini bermanfaat banget buat saya yang baru belajar ngeblog, Teng Q Boss….
December 21st, 2009 at 5:53 pm
mas hakim cara membuat blog kita ad angka statistik pengunjung dari negara ap and jumlh pengunjung nya berapa itu gimna?mas hakim tolong di terangkan lg
maklium pemula
December 31st, 2009 at 5:57 am
thx bwat infonya : )
January 10th, 2010 at 1:19 pm
wah mantaff gan
January 16th, 2010 at 11:21 pm
bener” dah….kenapa gak dari dulu ya aku nemuin blog mas hakim…..thx 4 all mas
February 1st, 2010 at 1:05 am
salam kenal…tutorial nya sangat bermanfaat sekali mas!!
saya izin copy ya…;) salam dan sukses slalu!!thx…
February 24th, 2010 at 11:39 pm
Terimakasih . hanya itu yg bisa saya sampaikan .
March 6th, 2010 at 3:21 pm
Makacih mas tipsnya,aku masi newbi neh… Lau sempat kunjungi balik bl0g aku juga ya, kasi masukan buat bl0gku.