html snowflakes code

<style>

.snowflake {

position: fixed;

top: -10px;

color: white;

font-size: 0.8em; /* μικρότερες χιονονιφάδες */

user-select: none;

pointer-events: none;

animation-name: fall;

animation-timing-function: linear;

z-index: 9999;

opacity: 0.8;

}

@keyframes fall {

to {

transform: translateY(110vh);

opacity: 0.2;

}

}

/* Responsive: μικρότερα flakes σε κινητά */

@media (max-width: 768px) {

.snowflake {

font-size: 0.6em;

}

}

</style>

<script>

function createSnowflake() {

const snowflake = document.createElement("div");

snowflake.classList.add("snowflake");

snowflake.textContent = "❄";

// Τυχαία θέση οριζόντια

snowflake.style.left = Math.random() * window.innerWidth + "px";

// Μικρότερες τυχαίες διαστάσεις

const size = Math.random() * 10 + 5;

snowflake.style.fontSize = size + "px";

// Τυχαία διάρκεια πτώσης

const duration = Math.random() * 5 + 5;

snowflake.style.animationDuration = duration + "s";

document.body.appendChild(snowflake);

// Αφαίρεση μετά την πτώση

setTimeout(() => {

snowflake.remove();

}, duration * 1000);

}

// Όταν φορτώσει η σελίδα, δημιουργούμε χιονονιφάδες κάθε 150ms

document.addEventListener("DOMContentLoaded", () => {

setInterval(createSnowflake, 150);

});

</script>