Efect ninsoare

Widget Efect Ninsoare 3D Ușoară (Canvas Gentle Drift) Realizat de petre-vitan

Previzualizare efect (Ninsoarea discretă cu balans stânga-dreapta rulează local):

PREVIZUALIZARE NINSOARE 3D

Codul sursă de copiat pentru Blogspot:

<!-- ======================================================= --> <!-- SCRIPT NINSOARE AMBIENTALĂ DISCRETĂ CU DRIFT LATERALE --> <!-- REALIZAT DE PETRE-VITAN --> <!-- ======================================================= --> <canvas id='petre-vitan-snow-canvas'></canvas> <style> #petre-vitan-snow-canvas { position: fixed !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; z-index: 999999 !important; pointer-events: none !important; background: transparent; } </style> <script type='text/javascript'> //<![CDATA[ (function() { var c = document.getElementById('petre-vitan-snow-canvas'); if (!c) return; var ctx = c.getContext('2d'), max = 75, // Numărul maxim de fulgi (ajustat pentru o ninsoare fină și elegantă) flakes = []; function resize() { c.width = window.innerWidth; c.height = window.innerHeight; } window.addEventListener('resize', resize); resize(); // Inițializare structură fulgi for (var i = 0; i < max; i++) { flakes.push({ x: Math.random() * c.width, y: Math.random() * c.height, r: Math.random() * 3 + 1, // Dimensiune rază fulg d: Math.random() * max, // Factor unic pentru balans sinusoidal v: Math.random() * 1 + 0.5 // Viteză cădere verticală }); } function draw() { ctx.clearRect(0, 0, c.width, c.height); ctx.fillStyle = 'rgba(255, 255, 255, 0.8)'; ctx.beginPath(); for (var i = 0; i < max; i++) { var f = flakes[i]; ctx.moveTo(f.x, f.y); ctx.arc(f.x, f.y, f.r, 0, Math.PI * 2, true); } ctx.fill(); move(); } var angle = 0; function move() { angle += 0.01; // Viteza de oscilație stânga-dreapta for (var i = 0; i < max; i++) { var f = flakes[i]; f.y += f.v; f.x += Math.sin(angle + f.d) * 0.5; // Efect de plutire / legănare naturală // Resetează fulgii care părăsesc marginile sau baza ecranului if (f.y > c.height || f.x > c.width || f.x < 0) { flakes[i] = { x: Math.random() * c.width, y: -10, r: f.r, d: f.d, v: f.v }; } } } function run() { draw(); requestAnimationFrame(run); } requestAnimationFrame(run); })(); //]]> </script>

🛠️ Cum se instalează efectul de ninsoare 3D pe Blogspot:

1. Copiați scriptul făcând clic pe butonul Copiază Codul situat direct deasupra casetei de text.
2. Accesați panoul administrativ Blogger.
3. În meniul din stânga, faceți clic pe opțiunea Temă (Theme).
4. Apăsați pe triunghiul mic de lângă butonul portocaliu „Personalizează” și selectați Editați HTML (Edit HTML).
5. Faceți un clic în interiorul editorului de cod și apăsați scurtătura Ctrl + F.
6. Căutați tag-ul de închidere structurală </body>.
7. Lipiți codul copiat exact deasupra / înainte de această etichetă </body>.
8. Apăsați pictograma de Salvare (dischetă) din colțul din dreapta-sus al ecranului pentru a rula ninsoarea pe blog.