CodeDevMLH/Seasonals-Snowfall
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

deleted old files

Browse Source
This commit is contained in:
MLH
2024-12-17 00:24:20 +01:00
parent 44ba61a199
commit 1a56eca5f7
1 changed files with 0 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
test.html
View File

@@ -1,83 +0,0 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Schneesturm-Animation</title>
<style>
body {
background-color: #000000;
overflow: hidden;
margin: 0;
height: 100vh;
}
.snowflake {
position: absolute;
background-color: white;
border-radius: 50%;
pointer-events: none;
}
</style>
</head>
<body>
<div id="snow-container"></div>
<script>
function createSnowflakes() {
const container = document.getElementById('snow-container');
const windowWidth = window.innerWidth;
const windowHeight = window.innerHeight;
for (let i = 0; i < 200; i++) {
const snowflake = document.createElement('div');
snowflake.classList.add('snowflake');
// Zufällige Größe zwischen 1 und 3 Pixel
const size = Math.random() * 3 + 1;
snowflake.style.width = `${size}px`;
snowflake.style.height = `${size}px`;
// Zufällige Startposition
snowflake.style.left = `${Math.random() * windowWidth}px`;
snowflake.style.top = `${Math.random() * windowHeight}px`;
container.appendChild(snowflake);
animateSnowflake(snowflake);
}
}
function animateSnowflake(snowflake) {
const speed = Math.random() * 3 + 1;
const sidewaysMovement = Math.random() * 2 - 1;
function fall() {
const currentTop = parseFloat(snowflake.style.top || 0);
const currentLeft = parseFloat(snowflake.style.left || 0);
// Fallen und seitliche Bewegung
snowflake.style.top = `${currentTop + speed}px`;
snowflake.style.left = `${currentLeft + sidewaysMovement}px`;
// Wenn Schneeflocke den Bildschirm verlässt, setze sie zurück oben
if (currentTop > window.innerHeight) {
snowflake.style.top = '0px';
snowflake.style.left = `${Math.random() * window.innerWidth}px`;
}
requestAnimationFrame(fall);
}
fall();
}
// Schneesturm beim Laden der Seite starten
createSnowflakes();
// Bei Fenstergrößenänderung anpassen
window.addEventListener('resize', () => {
document.getElementById('snow-container').innerHTML = '';
createSnowflakes();
});
</script>
</body>
</html>