Minggu, 26 Mei 2013

Cara Membuat Tulisan Atau Teks Iklan Berjalan di Blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم
SELAMAT DATANG DI JADIPINTAR.COM SITUS ILMU PENGETAHUAN DAN DA'WAH

Marquee adalah tag HTML yang berguna untuk membuat tampilan yang bergerak vertical atau horizontal. Dengan menggunakan tag Marquee ini kita dapat menghasilkan suatu tampilan yang cukup interaktif dikarenakan tag ini menghasilkan tampilan yang bergerak sehingga akan sangat menarik perhatian para pengunjung. Tag ini akan sangat baik bila digunakan untuk menampilkan suatu pengumuman-pengumuman pendek seperti yang kita lihat di televisi. 
Teks berjalan atau Marquee sudah familiar kita lihat di dunia periklanan (billboard) maupun pada tampilan televisi di bagian bawah yang juga disebut dengan running text. Marquee dapat menampilkan gerakan tulisan yang dapat menarik perhatian orang untuk membaca pesan yang ada di dalamnya; baik itu pesan komersil, informasi/berita, himbauan, dll. Nah anda juga bisa menambahi blog kesayangan dengan marquee ini. Materi tulisan terserah saja, bisa terjemahan Al-Qur'an atau Hadits (seperti blog ini), bisa pengumuman,bisa anjuran, atau teks komersil/iklan.

Cara Memasang Marquee:

1. Login ke Blogger anda terlebih dahulu  (misalnya masuk via: www.blogger.com)
2. Klik Nama blog anda.
3. Kemudian Klik Tata letak
4. Dan Pilih Add gadget lalu klik HTML/Javascript .
5. letakkan kode berikut di Html/Javascript : (di copy-paste)

Aneka Model Skrip Marquee, pilih mana jenis yang anda suka, lalu  masukkan (copy-Paste) skripnya yang berwarna hijau muda ke kotak HTML/JavaScript.

1. Teks berjalan dari kanan ke kiri

 <marquee>www.jadipintar.com</marquee>
www.jadipintar.com
2. Teks berjalan/tampil 5 kali saja lalu akan hilang
 <marquee loop"5">www.jadipintar.com</marquee>www.jadipintar.com
3. Teks seperti nomor 1 dengan tambahan blok warna biru
 <marquee bgcolor="blue">www.jadipintar.com</marquee>
www.jadipintar.com
4. Teks berjalan dalam separuh media
 <marquee width="50%>www.jadipintar.com</marquee>
www.jadipintar.com
5. Teks berjalan ngebut 10 kali kecepatn normal
 <marquee scrollamount="10">www.jadipintar.com</marquee>
www.jadipintar.com
6. Teks berjalan dari kiri ke kanan
<marquee direction="right">www.jadipintar.com</marquee>
www.jadipintar.com
7. Teks berjalan bolak-balik
<marquee behavior="alternate">www.jadipintar.com</marquee>
www.jadipintar.com
8. Teks meluncur ke bawah
<marquee direction="down" height="75">www.jadipintar.com</marquee>
www.jadipintar.com
9. Teks berjalan tunggu Mouse
<marquee behavior"alternate" onMouseOver="this.stop()" onMouseOut="this.start()">www.jadipintar.com</marquee>
www.jadipintar.com
10. Teks berjalan delay 0,3 detik
<marquee scrolldelay="300">www.jadipintar.com</marquee>
www.jadipintar.com
11. Teks Mendaki dari bawah ke atas
<marquee direction="up" height="100" onMouseOver="this.stop()" onMouseOut="this.start()" scrollamount="5"><a href="http://blogmashanif.blogspot.com/">www.jadipintar.com </a></marquee>
www.jadipintar.com
Keterangan :
Silakan ganti tulisan warna coklat (teks nomor 3 dengan warna kesukaan anda, in english)
Silakan ganti tulisan warna merah dengan tulisan apa saja yang anda suka.

Penjelasan:

1. WIDTH and HEIGHTAtribut ini digunakan untuk menentukan ukuran dari tampilan untuk tag MARQUEE
Contoh :
<marquee width=200 height=50> jadipintar.com </marquee> 
<marquee width=500 height=200> jadipintarj.com </marquee>
2. DIRECTIONAtribut ini digunakan untuk menentukan arah gerak dari tampilan apakah ingin ke kiri, kanan, atas, atau bawah.
Contoh :
<marquee direction=left> jadipintar.com </marquee>  
<marquee direction=right> jadipintar.com </marquee>  
<marquee direction=up> jadipintar.com </marquee>  
<marquee direction=down> jadipintar.com </marquee>
3. BEHAVIOURAtribut ini digunakan untuk menentukan bagaimana tampilan bergerak, jika sebelumnya yang ditentukan adalah arahnya maka pada atribut BEHAVIOUR yang ditentukan adalah perilaku geraknya.
Contoh :
BEHAVIOR = SCROLL
Dengan penentuan BEHAVIOR = SCROLL maka tampilan akan bergerak sesuai arah yang ditentukan dan akan kembali mengulangi gerakan dari titik awal gerakan.
<marquee behaviour=scrolljadipintar.com </marquee>
BEHAVIOR = SLIDE Dengan penentuan BEHAVIOR = SLIDE maka tampilan akan bergerak sesuai arah yang ditentukan lalu kemudian berhenti di titik akhir tanpa mengulangi gerakan sebelumnya.
<marquee behaviour=slidejadipintar.com </marquee>
BEHAVIOR = ALTERNATE
Dengan penentuan BEHAVIOR = ALTERNATE maka tampilan akan bergerak bolak-balik.
<marquee behaviour=alternatejadipintar.com </marquee>
Kalian dapat mencoba atribut-atribut diatas dan lihatkan hasilnya..
4. SCROLL DELAY. Atribut ini digunakan untuk menentukan jeda waktu antara tiap gerakan dari tampilan. Nilai yang diisi untuk atribut ini adalah berupa angka dalam mili detik.
Contoh :
Normal
<marquee> jadipintar.com </marquee> 
Delay 500 mili detik
<marquee scrolldelay=500> jadipintar.com </marquee>
Delay 1000 mili detik
<marquee scrolldelay=1000> jadipintar.com </marquee>
Anda dapat mencoba atribut-atribut diatas dan lihatkan hasilnya..
5. SCROLL AMOUNTMeskipun kelihatannya hampir sama dengan atribut sebelumnya SCROLLDELAY, SCROLLAMOUNT memiliki sedikit perbedaan dengan atribut tersebut. Jika SCROLLDELAY berfungsi untuk menentukan jeda waktu antara tiap gerakan, maka atribut SCROLLAMOUNT berfungsi untuk menentukan jauhnya lompatan untuk setiap gerakan. 
Contoh berikut merupakan perbedaan antara marquee normal dengan marquee yang mempunyai nilai SCROLLAMOUNT 20 mili detik dan 70 mili detik:
<marquee> jadipintar.com </marquee>  
<marquee scrollamount=20> jadipintar.com </marquee>  
<marquee scrollamount=70> jadipintar.com </marquee>
Anda dapat melihat hasilnya seteleh mengetik atribut-atribut diatas....
6. BGCOLORPenggunaan atribut BGCOLOR pada tag MARQUEE akan menghasilkan jalur gerakan memiliki warna. Prinsip kerja atribut ini sama dengan atribut BGCOLOR pada tag TABLE yaitu memberikan warna latar.
Contoh :
<marquee bgcolor=yellow> jadipintar.com </marquee> 
Tag diatas akan menghasilkan tulisan bergerak yang memiliki warna latar berwarna kuning.
7. HSPACEAtribut ini berguna untuk memberikan jarak antara tampilan bergerak dengan tulisan yang ada disamping kanan dan kiri tulisan.
Contoh :
Halo kawan <marquee width=25% bgcolor=yellow>  
jadipintar.com <br />  
Tempat dimana kamu bisa belajar segalanya !!  
</marquee> Halo kawan..
Kode diatas mempunyai nilai HSPACE default yaitu 0 sehingga tidak ada jarak dikiri dan kanan.
Sedangkan kode berikut ini mempunyai nilai HSPACE sebesar 70.
Halo kawan <marquee hspace=70 width=25% bgcolor=yellow>  
jadipintar.com <br />  
Tempat dimana kamu bisa belajar segalanya !!  
</marquee> Halo kawan..
8. VSPACEAtribut ini berguna untuk memberikan jarak antara tampilan bergerak dengan tulisan yang ada diatas dan dibawah tulisan.
Contoh
Halo kawan <br /><marquee width=25% bgcolor=yellow>  
jadipintar.com <br />  
Tempat dimana kamu bisa belajar segalanya !!  
</marquee><br />Halo kawan.. 
Kode diatas mempunyai nilai HSPACE default yaitu 0.
Sedangkan dibawah ini kode untuk memberikan jarak sebesar 50 px diatas dan dibawah marquee.
Halo kawan <br /><marquee vspace=50 width=25% bgcolor=yellow>  
jadipintar.com <br />  
Tempat dimana kamu bisa belajar segalanya !!  
</marquee><br />Halo kawan..
 Hasilnya dapat anda lihat sendiri setelah mencobanya... :)
9. LOOPPengulangan dari tampilan bergerak dengan tag MARQUEE dapat diatur jumlahnya dengan atribut ini. Jika kamu tidak mengatur jumlah pengulangan dengan atribut loop maka secara otomatis akan diartikan bahwa tampilan itu akan bergerak terus menerus tanpa batas.
Contoh penggunaan :
<marquee loop=2> jadipintar.com </marquee>
 Tag diatas mengkombinasikan atribut LOOP dengan atribut BEHAVIOR sehingga akan menghasilkan pengulangan sebanyak empat kali lalu setelah itu teks tersebut akan berhenti pada titik akhir.
Selamat berkreasi.
Sumber:
http://semogaberkah2010.blogspot.com/2011/03/tag-marquee-dan-atributnya.html

4 komentar:

  1. Jazzakumullah khair kang haji....... ilmu baru kye..., bisa dipake buat bikin tulisan yg bermanfaat, hadist, ayat2 Al-Qur'an dsb..

    BalasHapus
  2. Wa iyyaakum, apa saja yang bisa diambil dan dimanfaatkan dari blog E TA'LIM ini silakan ambil, sy ikhlas. Pangggilan "haji" antum insyaallah sebagai do'a, amin.....

    BalasHapus
  3. Wa iyyaakum,
    Tergantung dari model template yang antum pilih untuk blog, jika ada kotak "Tambahkan gadged" di atas / di bawah judul blog antum, di situlah skrip bisa dimasukkan, silakan anda cek di "Tata letak"

    BalasHapus