Membuat Animasi yang berterbangan di blog

Bismillah langsung saja yah.. karena terinspirasi sama seseorang yang seneng banget sama "bintang" jadi aku pengen posting sesuatu yang ada bintangnya, tapi apa yach??
ya udah dech kali ini kta akan mulai mempercantik blog kita dengan animasi2 yang gak kalah cantiknya yaitu animasi bintang kecil dan bidadari terbang di blog kamu...

sebenarnya gak cuma bintang aja yang bisa di pasang. tapi gambar2 lain sesuka kamu tapi kita coba dulu dengan gambar bintang soalnya, gimanaa gtu.. contohnya bisa dilihat / klik di blog percobaan ini

gimana?? tertarik?
langsung aja kali ya, gak usah banyak omong lagi. Langkah:
1. Masih seperti biasa Log-In dulu dengan ID masing-masing
2. Lalu masuk ke “Rancangan/Tata Letak” Trus “Elemen Laman”
3. Kemudian “Tambah Gadget” dan pilih “HTML/JavaScrip” caranya
4.yang belom tau caranya, silahkan baca  cara menambah script di sidebar
5. Kalo sudah tau caranya, langsung copy paste kode dibawah ini :

---

<script type='text/javascript'>
//<![CDATA[
var Ymax=8; //MAX # OF PIXEL STEPS IN THE "X" DIRECTION
var Xmax=8; //MAX # OF PIXEL STEPS IN THE "Y" DIRECTION
var Tmax=10000; //MAX # OF MILLISECONDS BETWEEN PARAMETER CHANGES

//FLOATING IMAGE UNTUK SETIAP URL GAMBAR. ADD OR DELETE ENTRIES. KEEP ELEMENT NUMERICAL ORDER STARTING WITH "0" !!

var floatimages=new Array();
floatimages[0]='http://i982.photobucket.com/albums/ae301/ratna91/Flying/66030.gif';
floatimages[1]='http://i982.photobucket.com/albums/ae301/ratna91/Flying/74238.gif';
floatimages[2]='http://i982.photobucket.com/albums/ae301/ratna91/Flying/74238.gif';
floatimages[3]='http://i982.photobucket.com/albums/ae301/ratna91/Flying/74238.gif';
floatimages[4]='http://i982.photobucket.com/albums/ae301/ratna91/Flying/74238.gif';

//*********JANGAN EDIT KODE DIBAWAH INI***********
var NS4 = (navigator.appName.indexOf("Netscape")>=0 && parseFloat(navigator.appVersion) >= 4 && parseFloat(navigator.appVersion) < 5)? true : false;
var IE4 = (document.all)? true : false;
var NS6 = (parseFloat(navigator.appVersion) >= 5 && navigator.appName.indexOf("Netscape")>=0 )? true: false;
var wind_w, wind_h, t='', IDs=new Array();
for(i=0; i<floatimages.length; i++){
t+=(NS4)?'<layer name="pic'+i+'" visibility="hide" width="10" height="10"><a href="javascript:hidebutterfly()">' : '<div id="pic'+i+'" style="position:absolute; visibility:hidden;width:10px; height:10px"><a href="javascript:hidebutterfly()">';
t+='<img src="'+floatimages[i]+'" name="p'+i+'" border="0">';
t+=(NS4)? '</a></layer>':'</a></div>';
}
document.write(t);
function moveimage(num){
if(getidleft(num)+IDs[num].W+IDs[num].Xstep >= wind_w+getscrollx())IDs[num].Xdir=false;
if(getidleft(num)-IDs[num].Xstep<=getscrollx())IDs[num].Xdir=true;
if(getidtop(num)+IDs[num].H+IDs[num].Ystep >= wind_h+getscrolly())IDs[num].Ydir=false;
if(getidtop(num)-IDs[num].Ystep<=getscrolly())IDs[num].Ydir=true;
moveidby(num, (IDs[num].Xdir)? IDs[num].Xstep : -IDs[num].Xstep , (IDs[num].Ydir)? IDs[num].Ystep: -IDs[num].Ystep);
}
function getnewprops(num){
IDs[num].Ydir=Math.floor(Math.random()*2)>0;
IDs[num].Xdir=Math.floor(Math.random()*2)>0;
IDs[num].Ystep=Math.ceil(Math.random()*Ymax);
IDs[num].Xstep=Math.ceil(Math.random()*Xmax)
setTimeout('getnewprops('+num+')', Math.floor(Math.random()*Tmax));
}
function getscrollx(){
if(NS4 || NS6)return window.pageXOffset;
if(IE4)return document.body.scrollLeft;
}
function getscrolly(){
if(NS4 || NS6)return window.pageYOffset;
if(IE4)return document.body.scrollTop;
}
function getid(name){
if(NS4)return document.layers[name];
if(IE4)return document.all[name];
if(NS6)return document.getElementById(name);
}
function moveidto(num,x,y){
if(NS4)IDs[num].moveTo(x,y);
if(IE4 || NS6){
IDs[num].style.left=x+'px';
IDs[num].style.top=y+'px';
}}
function getidleft(num){
if(NS4)return IDs[num].left;
if(IE4 || NS6)return parseInt(IDs[num].style.left);
}
function getidtop(num){
if(NS4)return IDs[num].top;
if(IE4 || NS6)return parseInt(IDs[num].style.top);
}
function moveidby(num,dx,dy){
if(NS4)IDs[num].moveBy(dx, dy);
if(IE4 || NS6){
IDs[num].style.left=(getidleft(num)+dx)+'px';
IDs[num].style.top=(getidtop(num)+dy)+'px';
}}
function getwindowwidth(){
if(NS4 || NS6)return window.innerWidth;
if(IE4)return document.body.clientWidth;
}
function getwindowheight(){
if(NS4 || NS6)return window.innerHeight;
if(IE4)return document.body.clientHeight;
}
function init(){
wind_w=getwindowwidth();
wind_h=getwindowheight();
for(i=0; i<floatimages.length; i++){
IDs[i]=getid('pic'+i);
if(NS4){
IDs[i].W=IDs[i].document.images["p"+i].width;
IDs[i].H=IDs[i].document.images["p"+i].height;
}
if(NS6 || IE4){
IDs[i].W=document.images["p"+i].width;
IDs[i].H=document.images["p"+i].height;
}
getnewprops(i);
moveidto(i , Math.floor(Math.random()*(wind_w-IDs[i].W)), Math.floor(Math.random()*(wind_h-IDs[i].H)));
if(NS4)IDs[i].visibility = "show";
if(IE4 || NS6)IDs[i].style.visibility = "visible";
startfly=setInterval('moveimage('+i+')',Math.floor(Math.random()*100)+100);
}}

function hidebutterfly(){
for(i=0; i<floatimages.length; i++){
if (IE4)
eval("document.all.pic"+i+".style.visibility='hidden'")
else if (NS6)
document.getElementById("pic"+i).style.visibility='hidden'
else if (NS4)
eval("document.pic"+i+".visibility='hide'")
clearInterval(startfly)
}
}

if (NS4||NS6||IE4){
window.onload=init;
window.onresize=function(){ wind_w=getwindowwidth(); wind_h=getwindowheight(); }
}

//]]>
</script>

---

Ket:

1. floatimage : Untuk menempatkan URL Image-nya, kalian bisa nambah atau mengurang.
2. Penetapan diawali dengan angka “0” sampai seterusnya
3. Kode yang warna merah ntu bisa kalian ganti dengan “URL IMAGE KALIAN” bisa lhat disini "url gambar animasi" sekian dulu semoga bermanfaat, wassalam. salam sahabat blogger dari santri-one

Jangan Lupa Baca yang ini Lho yach..:

widget blogger

• Memasang Emoticon KaskuSer
• Membuat Widget Top Comment
• Html Encoder untuk menampilkan script pada posting
• Membuat Menu Custom Dropdown
• Memasang Google Translate di sidebar
• Mengenal Widget/ Gadget Blogger
• Membuat Widget new post/ posting terbaru yang unik
• Cara membuat kotak Komentar terbaru" dengan fungsi scrollBox
• Cara Menambahkan Sesuatu Di Sidebar
• Memasang Radio Streaming Di blog/ website
• Membuat Tulisan ʞılɐqɹǝʇ
• Generator widget ( grunge heart )
• Memasang Profil Facebook Di blog
• Cara Membuat Menu 3 Tab View
• Membuat Buku tamu Tersembunyi
• Cara Memasang Jam di Sidebar Blog
• Cara Membuat Author Box / kotak penulis
• Cara membuat Buku Tamu Di Blog
• Cara Memasang Google Translate

tutorial blogger

• Membuat Tabel Pada posting Blog
• Memasang Emoticon KaskuSer
• Membuat Widget Top Comment
• Cara membuat Animasi Teks Membesar Part1
• Membuat Menu Custom Dropdown
• Kode warna Untuk Blog
• Memasang Google Translate di sidebar
• Mengenal Widget/ Gadget Blogger
• Membuat Widget new post/ posting terbaru yang unik
• Cara membuat kotak Komentar terbaru" dengan fungsi scrollBox
• Memasang Radio Streaming Di blog/ website
• Membuat Efek Link Pelangi
• Cara membuat Teks/ Tulisan Berjalan
• Cara Membuat Menu 3 Tab View
• Membuat Buku tamu Tersembunyi
• Cara Memasang Jam di Sidebar Blog
• Cara Membuat Author Box / kotak penulis
• Cara Mengganti Nama Blog
• Cara Setting Pengaturan Blogger
• Cara membuat Buku Tamu Di Blog
• Mengenal Istilah-istilah dalam Blogger
• Cara Memasang Google Translate
• Situs Penyedia Template Blogger
• Cara mengganti Template Blogger

mempercantik blog

• Membuat Tabel Pada posting Blog
• Memasang Emoticon KaskuSer
• Membuat Widget Top Comment
• Membuat Menu Custom Dropdown
• Kode warna Untuk Blog
• Membuat Widget new post/ posting terbaru yang unik
• Cara Menambahkan Sesuatu Di Sidebar
• Memasang Radio Streaming Di blog/ website
• Membuat Efek Link Pelangi
• Generator widget ( grunge heart )
• Cara membuat Teks/ Tulisan Berjalan