Apa kabar teman juga sobat semua dimana saja. semoga anda baik-baik saja yah..?
Pada hari ini saya akan berbagi buat sobat yang berminat memodivasi web-blog nya
Dengan effect bubble atau ballon, yang menghiasi homepage web-blog sobat semua
Sebagai
accessories blog anda ok sobat yang berminat mencobanya silahkan simak
 |
Effect Balloon |
Ada dua script effect ballon ini sobat yang saya posting kali ini,
Silahkan anda pilih yang mana? berikut tutorial memasang nya :
Cara memasang nya :Pertama anda masuk blog anda dan sigin, lalu masuk dasboard
Kemudian pilih layout-tata letak, pilih tambah gadget lalu copy kode java
Script di bawah ini ke dalam gadgte baru tadi di kolom html - java script
Ini kode effect ballon no 01
<script src='http://karrysta.googlecode.com/files/effectbalonkarrysta.js'/></script>
Setelah di paste kode di atas lalu save dan lihat hasil nya.
Selain kode effect ballon di atas di bawah ini adalah kode effect balloon
Yang lebih keren, dari yang diatas silahkan copy kode nya di bawah ini
Copy kode dibawah ini dan cara menimpan nya seperti contoh cara no 1
Ini kode effect bubbles menghiasi blog no 02 klik di bawah 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 URLS FOR EACH IMAGE. ADD OR DELETE ENTRIES. KEEP ELEMENT NUMERICAL ORDER STARTING WITH "0" !!
var floatimages=new Array();
floatimages[0]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsvt7B7grDKHMXQaogx75hKCRks1T4gTBvnvk4XySrdqIiS2bwV5Arm9p6NwSoSuCD8VqPLpKHeDd9nPqFKkbIWUkz4L3u4p-90tsyAwZbFiCb3ojBf8WJSXkp5EtKWYBPjiafO6lPFTT0/s400/filiex-bubbles+1.png';
floatimages[1]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiMJcwcpze5UYaxyvZArBQSvw2kn9BKchVhYcr5rhXj-sGBNf9RO7nLs5wqHug519fUNzu1AFhh_Vs7B26t480fb4smLNGircPZBpOoxbXSgtAvsMyg5ahvrv8KARzCU7-0jP-6XCD0-FS/s400/filiex-bubbles+3.png';
floatimages[2]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg45x_RVNKqx5C-FCzVA8SyiJ_20VSFnE9yQ5hXeNXJOW4j4QZCkJrtKaRvTP1nk11paIp7jxTCGt8V4SNwCwkUF3cHd1QD1XJau8O3YlrT6TmVrA7jkNizSV_BIKbOQvNU6NENf4ASY860/s400/filiex-bubbles+4.png';
floatimages[3]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHTVoH6cGw8pDZz6Qmp2gtaA8CXNKPUnpRgB_9OPXhKTaPBt4f8BjtYpb9upjS77r6ZD_DYJZW1MtCmMBA1HlxVGWM226nz5k09rDimspX7kPmnxuFQm3zCpBF9nWUX3z2rffet7B3wt0A/s400/filiex-bubbles+8.png';
floatimages[4]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDRplj_Vhp97lcrm7g1DpzUGuVTSW4ZCsdbtPrXRWeqziLVTh_zfplXPKJUoZ8VJshrTr6anrQ39emDTX9GK5tqycu0kb0icOcGSPA3DRXH68cu77MXFdyNhuP1805oKsa_DBPs9hsOFfW/s400/filiex-bubbles+7.png';
//*********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)?'<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>
Setelah di paste kode nya lalu save dan lihat hasil nya
Saya rasa cukup sekian semoga anda berhasil memsang kode effect ballon ini
Kalau ada kesulitan silahkan bertanya, atau berkomentar di kolom di bawah ini