Cara Pasang Kupu Kupu Terbang Pada Blog

Cara Pasang Kupu Kupu Terbang Pada Blog

Pada Kesempatan kali ini Saya Akan Berikan Tutorial untuk mempercantik Suatu Blog Yakni Dengan Memasang Kupu kupu Terbang Pada Area Blog Dan Sebenarnya Tutorial ini Sih Sudah Basi Tapi Demi Para Blogger Pemula Seperti Saya ini Saya Tetap Tidak Akan Malu Memperkenalkannya Kembali Pada Sobat Blogger Semua.

Untuk Melihat Demo Silahkan Click Gambar Kupu Kupu Dibawah !!!!

Caranya Sangatlah Mudah Dan Silahkan Simak Tutorial Dibawah ini.

  • Silahkan Sobat Login ke Akun Blogger Sobat.
  • Masuk Pada Rancangan Lalu Pilih Edit HTML Dan Jangan Lupa Centang Expand Template Widget.
  • Selanjutnya Sobat Cari Kode Dan Untuk Mempermudah Pencarian Pakai Ctrl F Pada Keyboard.
  • Silahkan Sobat Copy/Paste Kode Berikut tepat Di Atas Kode tersebut.

    //<![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 URLS FOR EACH IMAGE. ADD OR DELETE ENTRIES. KEEP ELEMENT NUMERICAL ORDER STARTING WITH “0” !!

    var floatimages=new Array();
    floatimages[0]=’http://i363.photobucket.com/albums/oo72/herisys/butterfly.gif&#8217;;
    floatimages[1]=’http://i363.photobucket.com/albums/oo72/herisys/butterfly.gif&#8217;;

    //*********DO NOT EDIT BELOW***********
    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)?’‘ : ‘

    ‘;
    }
    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(); }
    }

    //]]>

  • Selesai Lalu Simpan.
  • Lihat Hasilnya.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s