Hola, hoy os traigo un pequeño script que acabo de generar (si, si, con la ayuda inestimable de la IA, en este caso, Chat-GPT 5.1).
Con este script tendremos en cualquier página un efecto de copos de nieve cayendo muy chulo, y sin añadir ninguna librería externa, es super ligero.
<script>
document.addEventListener("DOMContentLoaded", () => {
const css = `
.snowflake {
position: fixed;
top: -10px;
color: white;
font-size: 1em;
pointer-events: none;
animation: fall linear infinite;
}
@keyframes fall {
to { transform: translateY(100vh); opacity: 0; }
}
`;
const style = document.createElement("style");
style.innerHTML = css;
document.head.appendChild(style);
function createFlake() {
const flake = document.createElement("div");
flake.className = "snowflake";
flake.textContent = "❄";
flake.style.left = Math.random() * window.innerWidth + "px";
flake.style.fontSize = 8 + Math.random() * 15 + "px";
flake.style.animationDuration = 4 + Math.random() * 6 + "s";
document.body.appendChild(flake);
setTimeout(() => flake.remove(), 10000);
}
setInterval(createFlake, 200);
});
</script>
Espero que os guste, y por supuesto, sentíos libres de usarlo, modificarlo y lo que queráis. Eso si, si lo mejoráis, ponerlo en los comentarios y lo actualizo ;-)
Gracias!
Top comments (0)