Rabu, 25 November 2015

selamat pagi sobat blogger kali ini saya akan sedikit memberikan trik untuk memberikan beberapa efek pada blog ....

di antara efek tersebut ada efek salju berjatuhan, efek daun berjatuhan,Kode Untuk efek bintang berjatuhan, Daun Hijau, Daun Kering, Mawar dan Efek Bubble .

oke tanpa perlu panjang lebar langsung saja kode/scrip ad di bawah ini.

Cara Membuat Efek Salju,Daun,Bintang Berjatuhan Di Blog

 CARA 1:
  • login ke dashbord blog kamu 
  • pilih 'Rancangan Design' 
  • klik 'Tambah gadget / Add gadget' 
  • pilih widget 'HTML/javascript' 
  • kemudian copy dan pastekan script dibawah ini.
  • lalu Simpan Template

CARA 2:

  • Seperti biasa login dulu ke dashboard blogger anda. 
  • Pilih Rancangan > Edit HTML, centang Expand widget template. 
  • Cari kode </head> 
  • Letakkan kode berikut diatas kode </head>
  • Simpan template kamu.

 



Kode Untuk efek salju berjatuhan, Copy kode dan letakan di atas kode </head> 

<script src='http://misbahudin-dcaesga.googlecode.com/files/efek-salju.js'/>



Kode Untuk efek daun berjatuhan, Copy kode dan letakan di atas kode </head>  

<script src='http://misbahudin.googlecode.com/files/daun%20gugur.js'/>



Kode Untuk efek bintang berjatuhan, Copy kode dan letakan di atas kode </head>  

<script src="http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.hijau.js" type="text/javascript"></script>


Daun Hijau


<script src="http://blogtegal.googlecode.com/files/efek-daun.js" type="text/javascript"/>

Daun Kering


<script language="JavaScript" src="http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/falling_leaves.js"> </script>


Mawar

<script type="text/javascript" src="http://yourjavascript.com/20412111345/mawar.js"></script>


Kode Membuat Efek Bubble 
<noscript></noscript><!– –><script type=”text/javascript” src=”http://www.freewebs.com/p.js”></script><script type=”text/javascript”>
// <![CDATA[
var colours=new Array("#F781BE", "#F781BE", "#F781BE", "#F781BE", "#F781BE"); // colours for top, right, bottom and left borders and background of bubbles
var bubbles=100; // maximum number of bubbles on screen
var x=ox=400;
var y=oy=300; var swide=800; var shigh=600; var sleft=sdown=0; var bubb=new Array(); var bubbx=new Array(); var bubby=new Array(); var bubbs=new Array(); window.onload=function() { if (document.getElementById) { var rats, div; for (var i=0; i<bubbles; i++) { rats=createDiv("3px", "3px"); rats.style.visibility="hidden"; div=createDiv("auto", "auto"); rats.appendChild(div); div=div.style; div.top="1px";

style="font-family: inherit;">div.left="0px";
div.bottom="1px";
div.right="0px";
div.borderLeft="1px solid "+colours[3];
div.borderRight=”1px solid “+colours[1];
div=createDiv(“auto”, “auto”);
rats.appendChild(div);
div=div.style;
div.top=”0px”;
div.left=”1px”;
div.right=”1px”;
div.bottom=”0px”
div.borderTop=”1px solid “+colours[0];
div.borderBottom=”1px solid “+colours[2];
div=createDiv(“auto”, “auto”);
rats.appendChild(div);
div=div.style;
div.left=”1px”;
div.right=”1px”;
div.bottom=”1px”;
div.top=”1px”;
div.backgroundColor=colours[4];
div.opacity=0.5;
if (document.all) div.filter=”alpha(opacity=50)”;
document.body.appendChild(rats);
bubb[i]=rats.style;
}
set_scroll();
set_width();
bubble();
}}
function bubble() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<bubbles; c++) if (!bubby[c]) {
bubb[c].left=(bubbx[c]=x)+”px”;
bubb[c].top=(bubby[c]=y)+”px”;
bubb[c].width=”3px”;
bubb[c].height=”3px”
bubb[c].visibility=”visible”;
bubbs[c]=3;
break;
}
}
for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
setTimeout(“bubble()”, 40);
}
function update_bubb(i) {
if (bubby[i]) {
bubby[i]-=bubbs[i]/2+i%2;
bubbx[i]+=(i%5-2)/5;
if (bubby[i]>sdown && bubbx[i]>0) {
if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
bubb[i].width=bubbs[i]+”px”;
bubb[i].height=bubbs[i]+”px”;
}
bubb[i].top=bubby[i]+”px”;
bubb[i].left=bubbx[i]+”px”;
}
else {
bubb[i].visibility=”hidden”;
bubby[i]=0;
return;
}
}
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sleft;
x=(e)?e.pageX:event.x+sdown; }
window.onresize=set_width;
function set_width() {
if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (typeof(self.innerHeight)==”number”) {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
else {
swide=800;
shigh=600;
}
}
window.onscroll=set_scroll;
function set_scroll() {
if (typeof(self.pageYOffset)==”number”) {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
function createDiv(height, width) {
var div=document.createElement(“div”);
div.style.position=”absolute”;
div.style.height=height;
div.style.width=width;
div.style.overflow=”hidden”;
return (div);
}
// ]]>
</script>

Jika sudah di letakan,klik save template anda dan lihat hasilnya
demikian semoga bermanfaat.

Tidak ada komentar:

Posting Komentar