Pernah tidak anda melihat tulisan / teks yang bergerak di suatu blog??
saya rasa pasti sudah pernah.. namanya marquee
! fungsinya sebenarnya hanyalah sebagai hiasan di blog, hampir sama dengan
headline news ( baca : memasang headline news di blog ) cuma yang ini
lebih mudah ngaturnya, terutama dalam mengatur gerakan / prilaku teks yang di
inginkan. Sobat yang tertarik membuat tulisan yang mondar - mandir ini,
silahkan ikuti terus tutorialnya.
1. Tulisan bergerak
dari kanan ke kiri
<marquee
direction="left" scrollamount="2"
align="center">Contoh Tulisan Berjalan</marquee>
2. Tulisan bergerak
dari kiri ke kanan
<marquee
direction="right" scrollamount="2"
align="center"> Contoh Tulisan Berjalan </marquee>
3. Teks bergerak
bolak balik ( mondar - mandir ) dari kiri ke kanan
<marquee
direction="left" scrollamount="2" align="center"
behavior="alternate"> Contoh Tulisan Berjalan </marquee>
4. Teks bergerak
bolak balik ( mondar - mandir ) dari kanan ke kiri
<marquee
direction="right" scrollamount="2" align="center"
behavior="alternate"> Contoh Tulisan Berjalan </marquee>
5. Teks bergerak
dari atas ke bawah
<marquee
direction="down" scrollamount="2" align="center">
Contoh Tulisan Berjalan </marquee>
6. Teks bergerak
dari bawah ke atas
<marquee
direction="up" scrollamount="2"
align="center"> Contoh Tulisan Berjalan </marquee>
7. Teks bergerak
mondar- mandir dari atas ke bawah
<marquee
direction="up" scrollamount="2" align="center"
behavior="alternate"> Contoh Tulisan Berjalan </marquee>
8. Teks bergerak
zig - zag ( diagonal ) memantul
<center><marquee
direction="up" scrollamount="2" align="center"
behavior="alternate" width="90%"><marquee
direction="right" behavior="alternate"> Contoh Tulisan
Berjalan </marquee></marquee></center>
9. Teks bergerak
zig - zag ( diagonal ) tembus
<center><marquee
direction="up" scrollamount="2" align="center"
behavior="alternate" width="90%"><marquee
direction="right"> Contoh Tulisan Berjalan
</marquee></marquee></center>
Cara memasang :
1. Login ke akun blog sobat
2. Klik rancangan Elemen laman Tambah gadget HTML/Javascript
3. Masukkan kode marquee dari salah satu tulisan berjalan diatas
4. Klik save dan lihat hasilnya.
tambahan :
1. Login ke akun blog sobat
2. Klik rancangan Elemen laman Tambah gadget HTML/Javascript
3. Masukkan kode marquee dari salah satu tulisan berjalan diatas
4. Klik save dan lihat hasilnya.
tambahan :
- Direction
: untuk mengatur pola gerakan teks (left, right, up dan down)
- Scrollamount
: untuk mengatur kecepatan gerakan teks. Naikkan angkanya ( dari 2 menjadi
3 ) untuk mempercepat gerakan dan sebaliknya.
- Behavior
( scroll/slide/alternate ): untuk mengatur prilaku gerakan.
- Untuk
menambahkan background, padding, border, color, dll pada
marquee, silahkan sisipkan kode marquee antara kode berikut :
<div
style="background: #000000; border: 2px solid #FF0000; color: white;
font-size: 20px; font-weight: bold; letter-spacing: 0.5em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center">Contoh Tulisan Berjalan</marquee>
</div>
<marquee direction="left" scrollamount="6" align="center">Contoh Tulisan Berjalan</marquee>
</div>
- Untuk
menyisipkan link pada marquee,
gunakan kode berikut :
<div
style="background: #FFFFFF; border: 2px solid #FF0000; color: black;
font-size: 20px; font-weight: bold; letter-spacing: 0.2em; padding: 15px;">
<marquee direction="left" scrollamount="6" align="center"><a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-teks-berjalan-di-blog.html"/>Cara Membuat Teks Berjalan di Blog</a></marquee>
</div>
<marquee direction="left" scrollamount="6" align="center"><a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-teks-berjalan-di-blog.html"/>Cara Membuat Teks Berjalan di Blog</a></marquee>
</div>
catatan
:
ganti tulisan yang berwana biru dengan Url yang di inginkan.
ganti tulisan yang berwana biru dengan Url yang di inginkan.
- Contoh
lain penggunaan link pada
marquee yaitu dengan
menggunakan kode berikut :
<marquee onmouseover="this.stop()"
onmouseout="this.start()" scrollamount="2" direction="up"
width="100%" height="100" align="center">
<a href=" http://christiantatelu.blogspot.com/2012/03/cara-membuat-permalink-di-blog.html/">cara membuat permalink di blog</a><br/>
<a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-logo.html">cara membuat logo</a><br/>
<a href="http://christiantatelu.blogspot.com/2012/03/blog-di-blogspot-dan-blog-di-wordpress.html">blog di blogspot dan blog di wordpress</a><br/>
</marquee>
<a href=" http://christiantatelu.blogspot.com/2012/03/cara-membuat-permalink-di-blog.html/">cara membuat permalink di blog</a><br/>
<a href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-logo.html">cara membuat logo</a><br/>
<a href="http://christiantatelu.blogspot.com/2012/03/blog-di-blogspot-dan-blog-di-wordpress.html">blog di blogspot dan blog di wordpress</a><br/>
</marquee>
catatan
:
kode yang di cetak tebal adalah perintah pada teks untuk terhenti ketika di lewati pointer.
kode yang di cetak tebal adalah perintah pada teks untuk terhenti ketika di lewati pointer.
Sekian
tutorial cara bikin tulisan berjalan nya....
0 komentar:
Post a Comment