How to Create Heart Effect when Clicking On Blogger



How to Create Heart Effect when Clicking On Blogger
The decoration for the mouse cursor on Blogger has many effects such as Snow falling on the mouse, the text following the Mouse Cursor and in this article is the heart effect soaring when clicking on any position on the interface Blogger interface. To visually feel you can make a click at any position in this article. How to Add Heart Effect When Clicking on Blogger

Apply Heart Effect on Blogspot Click
How to implement the setting of the heart effect when clicking on Blogger on the blog is quite simple with you just paste the following javascript before the </body> tag.

<script type='text/javascript'>
//<![CDATA[
!function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o(),r()}function r(){for(var e=0;e<d.length;e++)d[e].alpha<=0?(t.body.removeChild(d[e].el),d.splice(e,1)):(d[e].y--,d[e].scale+=.004,d[e].alpha-=.013,d[e].el.style.cssText="left:"+d[e].x+"px;top:"+d[e].y+"px;opacity:"+d[e].alpha+";transform:scale("+d[e].scale+","+d[e].scale+") rotate(45deg);background:"+d[e].color+";z-index:99999");requestAnimationFrame(r)}function o(){var t="function"==typeof e.onclick&&e.onclick;e.onclick=function(e){t&&t(),i(e)}}function i(e){var a=t.createElement("div");a.className="heart",d.push({el:a,x:e.clientX-5,y:e.clientY-5,scale:1,alpha:1,color:s()}),t.body.appendChild(a)}function c(e){var a=t.createElement("style");a.type="text/css";try{a.appendChild(t.createTextNode(e))}catch(t){a.styleSheet.cssText=e}t.getElementsByTagName("head")[0].appendChild(a)}function s(){return"rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"}var d=[];e.requestAnimationFrame=function(){return e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.oRequestAnimationFrame||e.msRequestAnimationFrame||function(e){setTimeout(e,1e3/60)}}(),n()}(window,document);
//]]>
</script>


Themes for Members

Powerful & High Quality

The reason why choosing our premium template.

AMP HTML

A cool Template is available that supports valid AMP HTML

RESPONSIVE

Responsive Optimized for your blog that adapts to all devices

SEO FRIENDLY

SEO Ready templates built with the best SEO practice in mind

ADSENSE OPTIMIZED

Easily place your Adsense ads to increase your revenue

FAST LOADING

The template loading speed is well optimized and very perfect

Subscribe & Social Media

Follow us via email or social media below

avatar
Admin Welcome to Netralid, if you have anything to ask please via our WhatsApp
:
counter customizable free hit