posted by: irv4n s@ndEr
Cara membuat animasi teks/double animation
di blogs
Yang dimaksud dengan animasi ini yaitu sebuah tempat untuk menyampaikan pesan
atau sesuatu ke pada para pembaca yang akan anda sampaikan yang dihiasi dengan
efek teks yang berjalan dan ditaburi warna yang membuat design anda menjadi
sedikit menarik, tidak hanya itu anda juga bisa mengganti tampilan
warna/kecepatan teks sesuai selera anda yang penting Ente senang hhhhh….!!!
Untuk membuat ini tentunya javascript/html yang kita gunakan
yang didalamnya diisi dengan code html, untuk penulisan kodenya Cuma sedikit
aja koq….
Apakah anda tertarik
???
Jika anda tertarik membuat animasi ini pada blog anda simak
benar-benar toturial saya berikan….
========== code htmlnya dibawah ini =============
<div
style="padding:5px 20px; border:2px solid blue; font-size:60px; font-family:Cataneo BT;font-weight:bolder;"><marquee
behavior="scroll" direction="left"
onmouseover="stop" onmouseout="run"
scrollamount="3">
<script type="text/javascript">
var message="Tulis text disini sesuka anda/terima kasih telah berkunjung di sm@rvan Edition and jangan lupa ya untuk meninggalkan komentar-pesan dan saran anda /tukaran link "
var bgsGR1color="red" //
var bgsGR2color="blue" //
var bgsGR3color="green" //
var flashspeed=50 //
var flashingletters=60 //
var flashingletters2=70 //
var flashpause=35 //
var n=0
if (document.all||document.getElementById){document.write('<font color="'+bgsGR1color+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')}else
document.write(message)
function crossref(number){var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj}function neon(){if (n==0){for (m=0;m<message.length;m++)
crossref(m).style.color=bgsGR1color}
crossref(n).style.color=bgsGR2color
if (n>flashingletters-1) crossref(n-flashingletters).style.color=bgsGR3color
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=bgsGR1color
if (n<message.length-1)
n++
else{n=0
clearInterval(flashing)
setTimeout("beginneon()",flashpause)
return}}
function beginneon(){if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)}
beginneon()
</script></marquee></div>
<script type="text/javascript">
var message="Tulis text disini sesuka anda/terima kasih telah berkunjung di sm@rvan Edition and jangan lupa ya untuk meninggalkan komentar-pesan dan saran anda /tukaran link "
var bgsGR1color="red" //
var bgsGR2color="blue" //
var bgsGR3color="green" //
var flashspeed=50 //
var flashingletters=60 //
var flashingletters2=70 //
var flashpause=35 //
var n=0
if (document.all||document.getElementById){document.write('<font color="'+bgsGR1color+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')}else
document.write(message)
function crossref(number){var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj}function neon(){if (n==0){for (m=0;m<message.length;m++)
crossref(m).style.color=bgsGR1color}
crossref(n).style.color=bgsGR2color
if (n>flashingletters-1) crossref(n-flashingletters).style.color=bgsGR3color
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=bgsGR1color
if (n<message.length-1)
n++
else{n=0
clearInterval(flashing)
setTimeout("beginneon()",flashpause)
return}}
function beginneon(){if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)}
beginneon()
</script></marquee></div>
Truzz gmna
cara bikin nya???
Caranya
begini……..!!!
anda hanya mengikuti 5 langkah yang saya berikan.
- Yang pasti Anda Login dahulu ke blogger.
- Pada menu dasbor pilih-click tata letAk
- Kemudian padA menu tata letAk tambahkan page element pada laman anda dengan mEng’Click [ tambah gadget / aDD gAdgEt ]
- Setelah andA meng”click pada laman ADD gAdgEt tadi akan muncul Tab baru yang berisi penambah gadget baru KemUdian cari dan click widget HTML/javascript.
- Yang terakhir, tulis code diatas tadi kedalam box HtML/ javascript kemudian Save dan lihat hasilnya……creng-creng jadi bukan!!! Jika Animasi teks andA tidak tAmpil periksa code HTML/Javascript kemungkinan Ada kesalahan dalam penulisan code Anda.
Ringkasnya : login blogger}dasbor}tata letak} add gadget } widget html/javascript } tulis
code }
Keterangan :
untuk code/ tulisan yang berwarna biru anda
bisa ganti dengan penjelasan seperti di bawah ini..
- font-size:21px; ( untuk mengganti ukuran teks Anda )
- var message=" ( untuk mengisi teks andA )
- var bgsGR1color="red" // ( untuk mengatur style animasi warna teks pertama anda )
- var bgsGR2color="blue" // ( untuk mengatur style animasi warna teks kedua anda )
- var bgsGR3color="green" // ( untuk mengatur style animasi warna teks ketiga anda )
- var flashspeed=50 // ( untuk mengatur kecepatan pergerakan pada warna anda )
- var flashingletters=60 // ( untuk mengatur jumlah animasi teks kedua anda )
- var flashingletters2=70 // ( untuk mengatur jumlah animasi teks ketiga anda )
- var flashpause=35 // ( jeda timing pada animasi teks anda )=== selamat mencoba dan jangan lupa isi komentar/tanggapan anda /terima kasih ===
0 komentar:
Posting Komentar