Code a inserer dans un Gadget Htlm Javascript
=== CODE===
<style>
.neige-cinematique {
position: fixed; top: 0; left: 0; width: 100%; height: 100%;
pointer-events: none; z-index: 10000;
}
.flocon-realiste {
position: absolute; background: white; border-radius: 50%;
opacity: 0.8; animation: chute-vent linear infinite;
}
/* On ajoute un flou magique sur certains flocons */
.flou { filter: blur(2px); }
@keyframes chute-vent {
0% { transform: translate(0, -10vh) rotate(0deg); }
100% { transform: translate(100px, 110vh) rotate(360deg); }
}
</style>
<div class="neige-cinematique" id="neige-luxe"></div>
<script>
const cage = document.getElementById('neige-luxe');
for (let i = 0; i < 80; i++) {
let f = document.createElement('div');
let size = Math.random() * 8 + 2;
f.className = size > 6 ? 'flocon-realiste flou' : 'flocon-realiste';
f.style.width = size + 'px';
f.style.height = size + 'px';
f.style.left = Math.random() * 100 + 'vw';
f.style.animationDuration = (Math.random() * 10 + 5) + 's';
f.style.animationDelay = (Math.random() * 5) + 's';
f.style.opacity = Math.random();
cage.appendChild(f);
}
</script>