Membuat Efek Salju pada Pointer Mouse di Blog

 Making Snow Effect on Mouse Pointers Blog

  In this post I will discuss how to make a snow effect when the mouse pointer digerakkkan, then the snow come to move in the direction of your mouse. This tutorial I present to you who love the beauty in order to decorate your blog look attractive....

 By installing a snowfall effect, then your blog will look more attractive and fascinating and when visitors come, surely these visitors will make the effects of snow on the blog as well. Dah ah brass tacks, Myspace become stale real, hehehe.

Here are the steps to make a snow effect on your blog:

1. Log in to Blogger

2. Select the Layout / Design.

3. In Tab click Add Page Element Gadget.

4. Click on HTML / Java Script

5. Then copy the code below code in HTML / Java Script

6. Complete, save and see the results

Since discussion on How to Make Snow Effect at Blogspot is complete, then congratulations meet in the next post, may be useful and good luck.

Do not Forget Comments and Like OK .... ^ _ ^

Regards Riy_Fie 4ever ....

 

Membuat Efek Salju pada Pointer Mouse di Blog

 Pada postingan kali ini saya akan membahas cara bikin efek hujan salju yang apabila mouse pointer digerakkkan, maka saljupun ikut bergerak mengikuti arah mouse anda. Tutorial ini saya sajikan untuk anda yang senang dengan keindahan dalam menghiasi blog anda supaya tampil menarik.

Dengan memasang efek hujan salju, maka blog anda akan tampil semakin menarik dan mempesona dan apabila pengunjung datang, pasti pengunjung tersebut akan membuat efek salju pada blognya juga. Dah ah basa-basinya, ntar jadi basi sungguhan, hehehe.

Berikut langkah-langkah bikin efek hujan salju di blog :

1. Login ke Blogger
2. Pilih Tata Letak / Rancangan.
3. Pada Tab Element Halaman klik Tambah Gadget.
4. Klik HTML/Java Script
5. Lalu copykan kode kode di bawah ini  pada HTML/ Java Script

<script type='text/javascript'>
// <![CDATA[
var colour="black";
var sparkles=100;

var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="3px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="3px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";

star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}

}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {


tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
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;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>

6. Selesai, simpan dan lihat hasilnya

Karena pembahasan tentang Cara Membuat Efek Salju di Blogspot sudah selesai, maka selamat bertemu di postingan berikutnya, semoga bermanfaat dan selamat mencoba. 

Jangan Lupa Comments dan Like OK....^_^

Salam Riy_Fie 4ever....