11 March 2012

Cara Buat Tulisan Berjalan / Effect Marquee di Blog

Tulisan berjalan, efek marquee


Efek marquee artinya memberikan atau membuat kesan berjalan/bergerak pada suatu text. Efek Marquee atau tulisan berjalan umumnya di letakkan di bagian atas Header blog atau di bagian Footer Blog dan biasanya Efek marquee berisikan teks ucapan selamat datang. Untuk menampilkan tulisan berjalan pada blog, kita hanya menyisipkan kode HTML SEBELUM dan SESUDAH teks yang akan ditampilkan. Di bawah ini terdapat delapan efek marquee yang saya berikan, silahkan di copy paste di blog sobat.

Tempatkan kode Effect Marquee atau tulisan berjalan pada tempat yang diinginkan (Kolom Postingan atau Kolom HTML Java Script).

Effect Marquee atau Tulisan berjalan lambat
<marquee behavior="scroll" scrollamount="1" scrolldelay="32">Tulisan sobat disini</marquee>  

Effect Marquee atau Tulisan berjalan ke atas
<marquee behavior="scroll" direction="up" height="30"> Tulisan sobat disini</marquee>  

Effect Marquee atau Tulisan Zig-zag
<marquee behavior="alternate" direction="up" height="50px"><marquee direction="right"> Tulisan sobat disini</marquee></marquee>  

Effect Marquee atau Tulisan berjalan tetapi berhenti kalau dibayangi cursor
<marquee onmouseout="this.start()" onmouseover="this.stop()">Tulisan sobat disini</marquee>  

Effect Marquee atau Tulisan berjalan ke kanan
<marquee behavior="scroll" direction="right">Tulisan Tulisan sobat disini</marquee>  

Effect Marquee atau Tulisan berjalan dengan gambar
<marquee behavior="scroll"><img height="84" src="Url%20gambar%20yang%20akan%20ditampilkan" width="110">Tulisan sobat disini</marquee>  

Effect Marquee atau Tulisan dapat memantul
<marquee behavior="alternate" width="300"> Tulisan sobat disini</marquee>  

Effect Marquee atau Tulisan Bouncing around
<marquee behavior="alternate" direction="up" height="100" width="300"><marquee behavior="alternate" direction="right">Tulisan sobat disini</marquee></marquee>  


Perhatikan Contoh di bawah ini!

Tulisan berjalan lambat
Tulisan sobat disini


Tulisan berjalan ke atas
Tulisan sobat disini


Tulisan Zig-zag

Tulisan sobat disini



Tulisan berjalan tetapi berhenti kalau dibayangi cursor
Tulisan sobat disini


Tulisan berjalan ke kanan
Tulisan Tulisan sobat disini


Tulisan berjalan dengan gambar


Tulisan sobat disini



Tulisan dapat memantul
Tulisan sobat disini


Tulisan Bouncing around

Tulisan sobat disini


Baca tutorial menarik lainnya di bawah ini :

29 comments:

  1. tkz gan, saya lagi tahap membuat blog,,,

    ReplyDelete
  2. ok.. tankz bro infonya.. aku
    lgi cari hiasan blog nigh..
    :-)

    ReplyDelete
  3. Wah Effect Marqueenya lengkap bangat.

    Maaf kalau buat widget facebook tersembunyi seperti di kanan blog ini gimana ya, kalau saya bisanya buat yg biasa. maksudnya nanti di klik trus keluar widgetnya, kalau punya http://bloggertutorialblog.blogspot.com auto hide gimana caranya ?

    Terimakasih.

    ReplyDelete
  4. Gimana kalo membuat 5 kata atau lebih dengan tulisan berjalan ke atas. Kalo contoh diatas kan cuma 1 kata/kalimat (Tulisan Sobat Disini)
    Terimakasih and salam sukses

    ReplyDelete
  5. nice info gan... kalo merubah ukuran tulisannya gmn..?
    http://ngawion-line.blogspot.com

    ReplyDelete
  6. postingan ini sangat menarik serta enak di baca tentang tulisan berjalan pada blog

    ReplyDelete
  7. mas..kalau mau buat design header mas gimana ya...

    ReplyDelete
  8. sangat menarik ulasannya bro dan salam kenal dari mico, dan juga kalau ada teman2 yg suka download film box office gratis silakan kunjungi situsnya gue ok, makasi untuk adminnya juga. thanks

    ReplyDelete
  9. Ijinin sy copy ea bos.............!!

    ReplyDelete
  10. gimn buaT tulisan terbang seperti ini ke atas :

    1. jumanji
    2. naruto
    3. isabela

    ReplyDelete
  11. Thankz ..... lg belajar buat blog juga neh....

    ReplyDelete
  12. Thankz ..... lg belajar buat blog juga neh....

    ReplyDelete
  13. SUKSES prakteknya, tulisannya saya buat berwarna, jadi lebih menarik. Terimakasih tutorialnya...

    ReplyDelete
  14. WAhhhhh tutorial gampang banget mkash ea kak

    ReplyDelete
  15. tips yang bagus buat pemula @http://alataartravel.com

    ReplyDelete
  16. ijin nyoba mas bro, saya sangat tertarik dengan artikel ini,

    kalo ada waktu kunjung balik mas bro
    http://muba-sky.blogspot.com/
    terimakasih

    ReplyDelete
  17. wah, bisa gan tulisannya jadi jalan. trimakasih .

    ReplyDelete
  18. bisa gan udah tak masukan kode nya di blog ku dan jadi. trimakasih...

    ReplyDelete