.

Membuat Teks Berjalan (Marquee)

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
Teks Anda
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
Teks Anda
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
Teks Anda
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
Teks Anda
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
Teks Anda
Marque 2.0.1 Pengembangan dari marquee sebelumnya, dengan pancingan scrollamount dia menjadi sangat agresif :)
Teks Anda
Tag Html
<marquee behavior="alternate" scrollamount="18">Teks Anda</marquee>
Marquee 2.0.2
Teks Anda
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 #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 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 #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 #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.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 #7
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 ^_^
thumbnail
Judul: Membuat Teks Berjalan (Marquee)
Rating: 100% based on 99998 ratings. 5 user reviews.
Ditulis Oleh

Artikel Terkait tutorial :

90 komentar:

  1. halo gan,,ane udah baca2 banyak artikel di blog ente,,artikelnya juga keren2..blog agan juga gak kalahkeren,,
    jangan lupa mampir ke blog ane juga ya

    ane tunggu kunjungan baliknya ya
    http://freekep.blogspot.com/

    BalasHapus
  2. akhirnya nemu juga nih artikel., hehehe

    BalasHapus
  3. haha., untuk teks nya gak jalan-jalan....

    BalasHapus
  4. makasi banget bantuannya, bisa di coba ini

    BalasHapus
  5. Amazing artikel…. Semoga saya bisa praktekan tipsnya dan berhasil

    BalasHapus
  6. Terima Kasih, Tulisan yang sangat membantu. Salam Sukses!

    BalasHapus
  7. Terima kasih atas pencerahannya, tulisannya menarik juga. Saya akan coba

    BalasHapus
  8. aku paling senang dengan semua pengetahuan ini, terima kasih sudah berbagi ilmu

    BalasHapus
  9. Setelah membaca Info dan Artikel, saya jadi ingin mencoba. Salam Sukses

    BalasHapus
  10. Terima kasih atas Artikel dan Info yang selalu menambah wawasan.semoga sukses

    BalasHapus
  11. Menarik, sangat Menarik Artikel dan Tipsnya. boleh dicoba. salam sukses

    BalasHapus
  12. saya akan mencoba tipsnya yang sangat bermanfaat sekali

    BalasHapus
  13. Tulisan dan Tipsnya sangat bermanfaat dan Infomatif. wajib dicoba. sukses selalu.

    BalasHapus
  14. Tips yang cerdas cuma di Wibesite ini banyak kumpulan Artikel bagus. harus dicoba. salam sukses

    BalasHapus
  15. Amazing artikel, Infonya bagus banyak mengandung Tips dan Pesan yang bermutu. salam sukses

    BalasHapus
  16. Cemerlang Postingan dan Infonya.boleh dicoba. ditunggu info berikutnya. Terimaksih

    BalasHapus
  17. Saya menemukan Artikel hebat di wibesite ini jadi ingin coba Tipsnya. Semoga berhasil

    BalasHapus
  18. Artikel Menarik terutama Infonya, boleh dicoba. Salam sukses

    BalasHapus
  19. Saya senang setelah membaca Tips dan Artikelnya, harus dicoba.Semoga berhasil

    BalasHapus
  20. Info dan Tulisannya Amazing, boeh dicoba. Sukses selalu

    BalasHapus
  21. Tipsnya sangat Infomatif, wajib dicoba salam sukses

    BalasHapus
  22. Terimakasih Banyak Tips dan Artikelnya, boleh dicoba. Salam sukses

    BalasHapus
  23. Terimakasih Artikelnya bermanfaat dan Infonya menambah Ilmu pengetahuan. Harus dicoba. Semoga berh

    BalasHapus
  24. setelah saya mencari cari di beberapa Wibesite , saya menemukan Artikel yang Bagus dan bermanfaat. Patut di coba, sukses selalu

    BalasHapus
  25. Saat membaca Artikel dan Tipsnya yang benar benar menarik. Jadi ingin mencoba. Salam sukses selalu

    BalasHapus
  26. cemerlang Postingan dan Infonya.boleh dicoba. ditunggu info berikutnya. Terimaksih

    BalasHapus
  27. Wibesite yang menarik di dalamnya banyak Artikel dan Tips yang mengandung Ilmu Pengetahuan, Harus dicoba.Ter

    BalasHapus
  28. Saya senang membaca Info dan Artikel yang di buat di Wibesite ini. Patut dicoba. Salam Sukses selalu.

    BalasHapus
  29. saya senang setelah membaca tipsnya,pasti saya akan di coba..

    BalasHapus
  30. terimakasih tips yang sangat amazingnya, pasti saya akan coba tipsnya

    BalasHapus
  31. Cemerlang Postingan dan Infonya.boleh dicoba. ditunggu info berikutnya. Terimaksih

    BalasHapus
  32. Postingan yang sangat Hebat, Tips boleh dicoba.salam sukses

    BalasHapus
  33. Artikel yang bermanfaat dan berguna, wajib di coba. sukses selalu

    BalasHapus
  34. Ilmu yang sangat Hebat, boleh dicoba Artikel dan Tipsnya. Semoga berhasil

    BalasHapus
  35. Artikel yang benar benar sangat infomantif dan Kreatif. boleh dicoba, sukses selalu

    BalasHapus
  36. setelah saya mencari cari di beberapa Wibesite , saya menemukan Artikel yang Bagus dan bermanfaat. Patut di coba, sukses selalu

    BalasHapus
  37. Baru kali ini saya membaca Artikel yang sangat membangun. Boleh dicoba

    BalasHapus
  38. wah bagus sekali infonya pasti say akan coba sekarang juga, sukses yah

    BalasHapus
  39. Tipsnya boleh dicoba, Artikelnya sangat bermanfaat.

    BalasHapus
  40. Terimaksih untuk info yang sangat efektif, boleh dicoba.

    BalasHapus
  41. Saved as a favorite, I like your site!

    My page; click here

    BalasHapus
  42. Its like you read my mind! You appear to know so much about this,
    like you wrote the book in it or something. I
    think that you could do with some pics to drive the message
    home a bit, but other than that, this is excellent blog.
    A great read. I'll definitely be back.

    Feel free to surf to my page Visit Link

    BalasHapus
  43. Hello! I just want to give you a huge thumbs up for the great info you have got right here on this post.
    I'll be returning to your website for more soon.

    Review my webpage ... More information

    BalasHapus
  44. You're so awesome! I don't suppose I've read through anything like that before. So wonderful to find someone with some genuine thoughts on this topic. Seriously.. many thanks for starting this up. This site is something that is needed on the web, someone with some originality!

    Also visit my web site: visit link

    BalasHapus
  45. What a material of un-ambiguity and preserveness of valuable knowledge about
    unpredicted emotions.

    Feel free to visit my homepage :: click here

    BalasHapus
  46. I know this site provides quality dependent articles and other data, is there any other web page which offers these stuff in quality?


    my homepage ... interior designers Gauteng

    BalasHapus
  47. Article writing is also a excitement, if you be acquainted
    with afterward you can write if not it is difficult to write.


    My website: Accomodation Marrakech B&B in Marrakech

    BalasHapus
  48. It's amazing for me to have a site, which is helpful for my knowledge. thanks admin

    Look at my page - recruitment

    BalasHapus
  49. Short winter sun breaks in paphos car hire will still loom:
    the question of why Motorola opted for the older,
    slower Firefox. Thrifty Paphos Car Hire does provide a rewards program.
    The city of one of my old favorite movies, I roll my eyes.


    my web page; http://rattanabb.com/modules.php?name=Your_Account&op=userinfo&username=MahaliaDu

    BalasHapus
  50. The choice is a wide though mostly flush affair, with minimal
    amount of spacing between the keys. An accident has to be
    it. Meanwhile, Ankara triggered by the discovery of the paphos car
    hire conflict. Alamo, Budget Paphos Car Hire,
    one of the highlights of any trip to Paphos Car Hire, look for drop-off places where the fee is little.


    My page ... Sugarforum.jp

    BalasHapus
  51. There's certainly a great deal to know about this subject. I like all the points you have made.

    my site; el cigaret

    BalasHapus
  52. Hey! Would you mind if I share your blog with my myspace group?
    There's a lot of folks that I think would really appreciate your content. Please let me know. Thanks

    My web-site; need money today for bills

    BalasHapus
  53. Today, I went to the beach with my kids. I found a sea shell and
    gave it to my 4 year old daughter and said "You can hear the ocean if you put this to your ear." She put the shell to her ear and screamed.
    There was a hermit crab inside and it pinched her ear. She never wants to go back!
    LoL I know this is totally off topic but I had to tell someone!



    Also visit my site :: sian

    BalasHapus
  54. This is really fascinating, You are an excessively skilled blogger.
    I've joined your rss feed and stay up for looking for extra of your magnificent post. Also, I've shared
    your web site in my social networks

    My web site - vaping ecigs

    BalasHapus
  55. Pretty! This was an extremely wonderful post. Thank you for
    providing this information.

    Also visit my webpage: http://www.youtube.com/watch?v=fCkK9-pzu_o

    BalasHapus
  56. Having read this I believed it was really enlightening.
    I appreciate you finding the time and effort to put this article together.
    I once again find myself personally spending a lot of time both reading and commenting.
    But so what, it was still worthwhile!

    Also visit my page - trade binary options

    BalasHapus
  57. What a mаterial of un-ambiguity and pгesеrveness οf pгeciouѕ
    familiагity conсerning unpгedicted feelіngs.


    Ηere іѕ my web sіte :: omega fish oil

    BalasHapus
  58. I just joined an interracial dating site which i thought was only for white ladies and black guys
    but all I at any time see are white guys seeking black females and
    vice versa.

    my page: marcus london

    BalasHapus
  59. Thats an exciting observation about folks not
    often wanting their Facebook friends to view
    that they are courting online but I am wondering if some privacy controls might be built into
    the dating app to limit or block other Facebook buddies from seeing that someone is making use of the dating app?


    My website: facebook statuses that will attract women

    BalasHapus
  60. We permit all feedback constructive and adverse. We usually do not
    delete comments which are meant to help audience.
    Nonetheless, proper off the bat, I'm able to inform you that we've no affiliation to any company and
    do not promote their products within our content material.


    my weblog gain muscle mass and lose fat diet

    BalasHapus
  61. Amazing! This sheds looks so elegant !

    my web blog Cheap arrow sheds

    BalasHapus
  62. terimaksih banyak ya atas infonya sangat bermanfaat untuk saya.....@

    BalasHapus
  63. makasih gan boleh di coba tuh .

    BalasHapus
  64. semoga info selanjutnya lebih menarik lagi...!!!

    BalasHapus
  65. informasinya menarik untk di baca, terimakasih Gan....

    BalasHapus
  66. Terima kasih banyak atas semua infonya, salam sukses..
    http://goo.gl/4NLscu

    BalasHapus
  67. ikut nyimak info yang ini gan, informasi yang tersaji sangat baik dan dapat menambah wawasan bagi saya sebagi pembaca. Saya tunggu Infomasi terbarunya gan..

    BalasHapus
  68. Makansih buat infomasinya, sangat bagus dan bermanfaat....

    BalasHapus
  69. trimakasih atas infonya
    salam kenal:)

    BalasHapus
  70. Enak sekali pagi hari baca artikel Anda, karena infonya sesuai dengan yang saya cari, makasih buat infonya....

    BalasHapus
  71. Terimakasih atas informasinya. Ditunggu terus informasi selanjutnya. :) Salam semangat dari yang tersemangat !!

    BalasHapus
  72. Blognya bagus, artikelnya juga sangat menarik. Top!

    BalasHapus
  73. Infonya sangat bermanfaat, jangan lupa kunjung balik.
    http://goo.gl/RLZgVV
    http://goo.gl/Qnehjm

    BalasHapus
  74. Terimakasih atas informasinya, artikel ini memberikan saya ilmu pengetahuan dan membimbing saya untuk langsung mempraktknnya dan sesuai dengan apa yang sedang cari .

    BalasHapus
  75. Sudah sore,,,, tetap harus Semangaaaaaaaaat........ !! :D

    BalasHapus
  76. Terima kasih banyak atas semua infonya..
    http://goo.gl/5zJIpW

    BalasHapus
  77. Terimakasih atas infonya .. semoga bermanfaat bagi orang banyak :) amin

    BalasHapus
  78. sipp,,,tugas HTMl jadi beres karena da info ini,,tks

    BalasHapus
  79. Ijin menyimak dan belajar terimakasih semoga kita selalu dalam kelancaran,thank admin

    BalasHapus
  80. Pengen yang lebih seru ...
    Ayo kunjungi www.asianbet77.com
    Buktikan sendiri ..

    Real Play = Real Money

    - Bonus Promo Red Card pertandingan manapun .
    - Bonus Mixparlay .
    - Bonus Tangkasnet setiap hari .
    - New Produk Sabung Ayam ( minimal bet sangat ringan ) .
    - Referal 5 + 1 % ( seumur hidup ) .
    - Cash Back up to 10 % .
    - Bonus Royalty Rewards setiap bulan .

    untuk Informasi lebih jelasnya silahkan hubungi CS kami :
    - YM : op1_asianbet77@yahoo.com
    - EMAIL : asianbet77@yahoo.com
    - WHATSAPP : +63 905 213 7234
    - WECHAT : asianbet_77
    - SMS CENTER : +63 905 209 8162
    - PIN BB : 2B4BB06A / 28339A41

    Salam Admin ,
    http://asianbet77.com/

    BalasHapus
  81. teks yang berjalan bikin menarik pengunjung

    BalasHapus
  82. Ini ngaruh ga sama loading website?

    BalasHapus

 
Copyright © 2013. About - Sitemap - Contact - Privacy
Template Seo Elite oleh Bamz