Kamu tidak perlu khawatir Cara Membuat Efek Animasi Turun Salju Blogger ini tidak akan membuat situs Blogger kamu jadi lambat karena animasi salju ini cukup ringan dan tidak akan mempengaruhi Seo di template kamu.
Cara Membuat Efek Animasi Turun Salju Blogger
- Buka Dashboard Blogger
- Pergi ke Tema > Edit Tema
- Kemudia letakan kode dibawah ini tepat diatas
</body>
<div class='cont-salju'>
<canvas class='salju' id='salju'></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("salju"))},"loading"!=document.readyState?n():document.addEventListener("DOMContentLoaded",n)}();
//]]>
</script>
- Setelah itu letakan kode CSS dibawah ini tepat di atas kode
</head>
<style type='text/css'>
/* Efek Salju Berjatuhan */
.salju{position:fixed;top:0;left:0;right:0;pointer-events:none;z-index:20}
.cont-salju{height:100%;position:relative;overflow:hidden;z-index:1}
</style>
Penutup
Berikut adalah artikel mengenai Cara Membuat Efek Animasi Turun Salju Blogger semog artikel ini bermanfaat ya jangan lupa share dan berikan komentar kalian.