Monday, February 11, 2013

How To Add Falling Hearts In Blogger Blog For Valentines Day

Author: Gagan Masoun
How To Add Falling Hearts In Blogger Blog For Valentines DayIn this tutorial I have a beautiful falling hearts widget for your Blogger blog. This hack will display falling hearts in your blog. So, it look like original hearts falling effect. This special code for special valentine day. Here is valentine day's date sheet: 7 Feb. Rose Day, 8 Feb. Propose Day, 9 Feb. Chocolate Day, 10 Feb. Teddy Day, 11 Feb. Promise Day, 12 Feb. Hug Day, 13 Feb. Kiss Day, 14 Feb.Valentine’s Day.

You May Like To Read:
The Heart Fall effect we use is so easy and wont disturb the visitors. Here, I'm showing you demo first.You can check this effect before implement on your blog. Install this script in few seconds.


Live Demo

How to Add Falling Hearts Effect To Blogger Blog

  • Go to Blogger Dashboard -> Choose Blog -> Click On Template Tab
  • Click Edit HTML Menu -> Proceed
  • Now,Press (Ctrl+F) and Search Code </body>
  • Add Below Code Just Above/Before </body>
<script type='text/javascript'>//<![CDATA[
function iecompattest(){return document.compatMode&&document.compatMode!="BackCompat"?document.documentElement:document.body}function snowIE_NS6(){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){yp[i]+=sty[i];if(yp[i]>doc_height-50){xp[i]=Math.random()*(doc_width-am[i]-30);yp[i]=0;stx[i]=.02+Math.random()/10;sty[i]=.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()",10)}function hidesnow(){if(window.snowtimer)clearTimeout(snowtimer);for(i=0;i<no;i++)document.getElementById("dot"+i).style.visibility="hidden"}var snowsrc="http://2.bp.blogspot.com/-eApkABthZDo/URkNgZFf6DI/AAAAAAAAEbE/5KEqwpTiIHk/s1600/HEARTS.png";var no=15;var hidesnowtime=0;var snowdistance="pageheight";var ie4up=document.all?1:0;var ns6up=document.getElementById&&!document.all?1:0;var dx,xp,yp;var am,stx,sty;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("Blogsdaddy.com")!=-1?"http://2.bp.blogspot.com/-eApkABthZDo/URkNgZFf6DI/AAAAAAAAEbE/5KEqwpTiIHk/s1600/HEARTS.png":snowsrc;for(i=0;i<no;++i){dx[i]=0;xp[i]=Math.random()*(doc_width-50);yp[i]=Math.random()*doc_height;am[i]=Math.random()*20;stx[i]=.02+Math.random()/10;sty[i]=.7+Math.random();if(ie4up||ns6up){if(i==0){document.write('<div id="dot'+i+'" style="POSITION: absolute;Z-INDEX: '+i+';VISIBILITY: visible;TOP: 15px;LEFT: 15px;"><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>')}}}if(ie4up||ns6up){snowIE_NS6();if(hidesnowtime>0)setTimeout("hidesnow()",hidesnowtime*1e3)}//]]></script>
That's it check out your cool new falling hearts.Check out more of our Blogger Gadgets and Tutorials. Drop Your Comments And Questions Below.

Author
Author - This post is written by Surkhab Sidhu of Sardari Music. He lives in India, has been blogging since 2010 . You can also follow him on Facebook @Surkhab Sidhu

8 comments: