Sunday 1 November 2009

Creating falling Heart Effect to blogger

This Hack will create A falling heart effect on your blog on the top of all of your content.This effect is similar to my one of the previous posts  creating spring effect to blogger . This tricks use simple html To create a falling heart effect.This effect works on the concept Of Marque (HTML)
1.lets first see A demo of this trick
2. Copy Below html Code

<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:130px; top:150px; width:16px; height:548px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="3" style="position:absolute; left:177px; top:170px; width:16px; height:388px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:225px; top:190px; width:16px; height:324px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:265px; top:180px; width:16px; height:499px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:325px; top:160px; width:16px; height:411px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:239px; top:190px; width:16px; height:251px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="1" style="position:absolute; left:141px; top:150px; width:16px; height:221px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="7" style="position:absolute; left:289px; top:170px; width:16px; height:230px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:108px; top:230px; width:16px; height:241px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:370px; top:190px; width:16px; height:386px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:394px; top:150px; width:16px; height:484px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:430px; top:170px; width:16px; height:442px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="3" style="position:absolute; left:475px; top:200px; width:16px; height:423px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="6" style="position:absolute; left:559px; top:170px; width:16px; height:541px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:580px; top:200px; width:16px; height:423px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:533px; top:170px; width:16px; height:385px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="1" style="position:absolute; left:614px; top:200px; width:16px; height:332px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="3" style="position:absolute; left:651px; top:250px; width:16px; height:386px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:684px; top:290px; width:16px; height:514px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="1" style="position:absolute; left:658px; top:180px; width:16px; height:247px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="1" style="position:absolute; left:694px; top:160px; width:16px; height:216px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="2" style="position:absolute; left:738px; top:200px; width:16px; height:392px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="1" style="position:absolute; left:753px; top:150px; width:16px; height:544px;"><span style="color: red;">%u2665</span></marquee>
<marquee behavior="scroll" direction="down" scrollamount="5" style="position:absolute; left:800px; top:180px; width:16px; height:404px;"><span style="color: red;">%u2665</span></marquee>
<a href="http://Myfundoo-blog.blogspot.com">
<br /><img src="http://img1.orkut.com/img/castro/i_tool.png" align="right" border="0" width="14" height="14">
</a></div>

3.Adding To blogspot.
1. Log into blogger and go to your blogger account dashboard.
2. Navigate to layout and on your sidebar click Add Gadget and select HTML/javaScript
3. leave the title empty, and on the content area, paste your generated code.
4. click Save, now move the gadget from sidebar top area to bottom area.
5. Click save changes And Enjoy,



No comments:

Post a Comment