Heart Rain Effect

R

ain Effects Heart-O friend of all, how are you? Sorry lately I became very rarely go online and update information on tips and tricks to beautify the bloggers, or other tips and tricks related to the bloggers, this is because I am busy to implement SNMPTN or abbreviation of the National Selection Entrance State University, and the SNMPTN this year I want to pursue STEI-ITB (School of Electrical Engineering and Informatics - Bandung Institute of Technology), therefore I have to really focus, when I focus with the National Examination which was held in April last, I beg of prayer from friends everything, because I hope God in favor of hope and my desire, to study and learn the science of technology and Informatics at Universities and colleges are very superior in Indonesia kalanjutan future for me and for my parents happy.

Well, for this opportunity, I will share with my friends all about a trick to add a very nice effect if any on the blog or personal website mate, namely the effect of liver rain or love the rain effect.

Basically, this effect can work with various effects, can be altered by the effect of falling snow, rain effects of numbers, money rain effects, the effects of dollar rain, rain effects animation, and / or the like depending on the creativity of fellow bloggers as well.

The assembly or installation of this effect is very easy and straightforward, we o need to go to Edit HTML and / or the like, we only need to click, click, and clicks, this effect can appear on your blog all. Following Biklah way pair:

1. Make sure you are logged in with an account in blogger buddies all.

2. Click Layout

3. Add a Widget

4. Click HTML / JavaScript

5. Copy and paste the following script into it.

 <script type="text/javascript">

 /******************************************
 * Snow Effect Script- oleh Altan d.o.o. (http://www.altan.hr/snow/index.html) Diposkan oleh MiMuha
 ******************************************/

 // Ubah alamat URL gambar ke lokasi yang anda upload
 var snowsrc="http://i892.photobucket.com/albums/ac130/el-syie/heart-1.png"
 // Ubah jumlah gambar item/salju yang akan tampil pada web
 var no = 15;
 // Ubah berapa detik salju akan muncul pada web (0=akan selalu muncul):
 var hidesnowtime = 0;
 // Ubah kapan efek salju akan hilang di bawah halaman ("windowheight" [menghilang saat mencapai bawah window browser] atau "pageheight" [menghilang saat berada di bawah halaman web])
 var snowdistance = "pageheight";

 ///////////Stop Config//////////////////////////////////

 var ie4up = (document.all) ? 1 : 0;
 var ns6up = (document.getElementById&&!document.all) ? 1 : 0;

 function iecompattest(){
 return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
 }

 var dx, xp, yp; // coordinate and position variables
 var am, stx, sty; // amplitude and step variables
 var i, doc_width = 800, doc_height = 600;

 if (ns6up) {
 doc_width = self.innerWidth;
 doc_height = self.innerHeight;
 } else if (ie4up) {
 doc_width = iecompattest().clientWidth;
 doc_height = iecompattest().clientHeight;
 }

 dx = new Array();
 xp = new Array();
 yp = new Array();
 am = new Array();
 stx = new Array();
 sty = new Array();
 snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "salju.gif" : snowsrc
 for (i = 0; i < no; ++ i) {
 dx[i] = 0; // set coordinate variables
 xp[i] = Math.random()*(doc_width-50); // set position variables
 yp[i] = Math.random()*doc_height;
 am[i] = Math.random()*20; // set amplitude variables
 stx[i] = 0.02 + Math.random()/10; // set step variables
 sty[i] = 0.7 + Math.random(); // set step variables
 if (ie4up||ns6up) {
 if (i == 0) {
 document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
 } else {
 document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
 }
 }
 }

 function snowIE_NS6() { // IE and NS6 main animation function
 doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
 doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
 for (i = 0; i < no; ++ i) { // iterate for every dot
 yp[i] += sty[i];
 if (yp[i] > doc_height-50) {
 xp[i] = Math.random()*(doc_width-am[i]-30);
 yp[i] = 0;
 stx[i] = 0.02 + Math.random()/15;
 sty[i] = 0.7 + Math.random();
 }
 dx[i] += stx[i];
 document.getElementById("dot"+i).style.top=yp[i]+"px";
 document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";
 }
 snowtimer=setTimeout("snowIE_NS6()", 15);
 }

 function hidesnow(){
 if (window.snowtimer) clearTimeout(snowtimer)
 for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
 }


 if (ie4up||ns6up){
 snowIE_NS6();
 if (hidesnowtime>0)
 setTimeout("hidesnow()", hidesnowtime*1000)
 }

 </script>

6. Click Save

Note:
* Replace the image URL that is red with the URL of the image that you like
* Images can be searched image hosting service you like.
* 15 green is the amount that would arise bambar
* 0 is the time bambar yellow would come out
* Pageheight can digenti with windowheight if you want the image disappears in the down position the browser, but if you want to disappear at the bottom of the web page or blog so let it not be changed.

Videos:
Youtube Rain Effect