Cara Membuat Running text di Blog - Pernah tidak sobat melihat tulisan
/ teks yang mondar - mandir di suatu blog?? saya rasa pasti sudah
pernah.. namanya marquee sob! fungsinya sebenarnya hanyalah sebagai
hiasan di blog, hampir sama dengan headline news. 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>
hasilnya
2. Tulisan bergerak dari kiri ke kanan
<marquee direction="right" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
hasilnya
3. Teks bergerak bolak balik ( mondar - mandir ) dari kiri ke kanan
<marquee direction="left" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
4. Teks bergerak bolak balik ( mondar - mandir ) dari kanan ke kiri
<marquee direction="right" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
5. Teks bergerak dari atas ke bawah
<marquee direction="down" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
hasilnya
6. Teks bergerak dari bawah ke atas
<marquee direction="up" scrollamount="2" align="center"> Contoh Tulisan Berjalan </marquee>
hasilnya
7. Teks bergerak mondar- mandir dari atas ke bawah
<marquee direction="up" scrollamount="2" align="center" behavior="alternate"> Contoh Tulisan Berjalan </marquee>
hasilnya
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>
hasilnya
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>
hasilnya
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 :
- 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>
hasilnya :
- 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>
catatan :
ganti tulisan yang berwana biru dengan Url yang di inginkan.
hasilnya :
- 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>
catatan :
kode yang di cetak tebal adalah perintah pada teks untuk terhenti ketika di lewati pointer
Hasilnya :
Cara Membuat Tulisan Di Tab Blog Bergerak dan berganti ganti text
cara ubah judul tab blog berganti ganti text serta runnuig text
1. Ikuti cara sebelumnya sampai no. 2.
2. Setelah itu klik Tambah Gadget/ Add Gadget, kemudian pilih HTML/Javascript.
3. Masukan Script dibawah ini
<script>function tb8_makeArray(n){this.length = n;return this.length;}tb8_messages = new tb8_makeArray(3);
tb8_messages[0] = "Hai Para Blogger...";
tb8_messages[1] = "Selamat Datang di skynesia";
tb8_messages[2] = "skynesia.blogspot.com";
tb8_rptType = 'infinite';
tb8_rptNbr = 5;
tb8_speed = 125;
tb8_delay = 1000;
var tb8_counter=1;
var tb8_currMsg=0;
var tb8_tekst ="";
var tb8_i=0;
var tb8_TID = null;
function tb8_pisi(){
tb8_tekst = tb8_tekst + tb8_messages[tb8_currMsg].substring(tb8_i, tb8_i+1);
document.title = tb8_tekst;
tb8_sp=tb8_speed;
tb8_i++;
if (tb8_i==tb8_messages[tb8_currMsg].length){
tb8_currMsg++; tb8_i=0; tb8_tekst="";tb8_sp=tb8_delay;
}
if (tb8_currMsg == tb8_messages.length){
if ((tb8_rptType == 'finite') && (tb8_counter==tb8_rptNbr)){
clearTimeout(tb8_TID);
return;
}
tb8_counter++;
tb8_currMsg = 0;
}
tb8_TID = setTimeout("tb8_pisi()", tb8_sp);
}
tb8_pisi()
</script>
dari script tersebut yang perlu diubah :
tb8_messages[0] = "Hai Para Blogger...";
tb8_messages[1] = "Selamat Datang di skynesia";
tb8_messages[2] = "skynesia.blogspot.com";
Ganti tulisan berwarna merah dengan tulisan yang anda inginkan.
kalau
diatas hanya terdapat 3 kalimat yang bergantian di judul tab blog, maka
kamu bisa menambahkannya dengan kata-kata lain dengan cara menambah
script
tb8_messages[3] =
"tulis text yang anda mau";
tb8_messages[4] = "tulis text yang anda mau";
Sekian posting cara bikin tulisan berjalannya..
