Friday, 23 July 2021

Add snowfall effect to blogger

Add snowfall effect to blogger
July 23, 2021
Hello my friends, Happy New Year everyone, I hope you are in good health.
In short, our post today is about adding the effect of snowfall to blogger blogs, a light addition to the site that does not affect its download and adds the luster of the winter season. I leave you with the preview and the application
Explain how to install
1. Log in to your blog
2. Appearance >> Edit HTML
3. Find <body> with CTRL+F
4. Put the following code before
<style>
  .snow{position:fixed;top:0;left:0;right:0;pointer-events:none;z-index:20}.contentz{height:100%;position:relative;overflow:hidden;z-index:1}
  </style>
  <div class='contentz'>
  <canvas class='snow' id='snow'></canvas>
  </div>
  <script type='text/javascript'>
  //<![CDATA[
  !function(){function t(t){var n=t.getContext("2d"),e=0,i=0,o=[],d=function(){this.x=this.y=this.dx=this.dy=0,this.reset()};function a(){e=window.innerWidth,i=window.innerHeight,t.width=e,t.height=i,function(t){if(t!=o.length){o=[];for(var n=0;n<t;n++)o.push(new d)}}(e*i/1e4)}d.prototype.reset=function(){this.y=Math.random()*i,this.x=Math.random()*e,this.dx=1*Math.random()-.5,this.dy=.5*Math.random()+.5},a(),function t(){n.clearRect(0,0,e,i),n.fillStyle="rgba(255,255,255,.3)",o.forEach(function(t){t.y+=t.dy,t.x+=t.dx,t.y>i&&(t.y=0),t.x>e&&(t.reset(),t.y=0),n.beginPath(),n.arc(t.x,t.y,5,0,2*Math.PI,!1),n.fill()}),window.requestAnimationFrame(t)}(),window.addEventListener("resize",a)}var n;n=function(){t(document.getElementById("snow"))},"loading"!=document.readyState?n():document.addEventListener("DOMContentLoaded",n)}();
  //]]>
  </script>
  
Share This :
SUBSCRIBE TO OUR NEWSLETTER

No comments: