Endlosschleife Chips beendet?!
This commit is contained in:
parent
80da3247a1
commit
3d782b21ea
1 changed files with 18 additions and 12 deletions
30
js/script.js
30
js/script.js
|
|
@ -1,31 +1,37 @@
|
||||||
// Chipsregen
|
// Chipsregen
|
||||||
|
|
||||||
console.log ("Meine Seite läuft");
|
console.log("Meine Seite läuft");
|
||||||
|
|
||||||
|
// Chips erstellen
|
||||||
function createChip() {
|
function createChip() {
|
||||||
|
|
||||||
const chip = document.createElement("img");
|
const chip = document.createElement("img");
|
||||||
|
|
||||||
chip.src = "img/Chips.png";
|
chip.src = "img/Chips.png"; // ggf. Pfad prüfen
|
||||||
|
|
||||||
chip.classList.add("chip");
|
chip.classList.add("chip");
|
||||||
|
|
||||||
|
const size = Math.random() * 50 + 50;
|
||||||
|
chip.style.width = size + "px";
|
||||||
|
|
||||||
chip.style.left = Math.random() * window.innerWidth + "px";
|
chip.style.left = Math.random() * window.innerWidth + "px";
|
||||||
|
|
||||||
chip.style.animationDuration =
|
const duration = Math.random() * 3 + 3;
|
||||||
(Math.random() * 3 + 3) + "s";
|
chip.style.animationDuration = duration + "s";
|
||||||
|
|
||||||
chip.style.width =
|
|
||||||
(Math.random() * 50 + 50) + "px";
|
|
||||||
|
|
||||||
document.body.appendChild(chip);
|
document.body.appendChild(chip);
|
||||||
|
|
||||||
setTimeout(() => {
|
// Entfernen nach Animation (besser als fixe Zeit)
|
||||||
|
chip.addEventListener("animationend", () => {
|
||||||
chip.remove();
|
chip.remove();
|
||||||
}, 6000);
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
setInterval(createChip, 300);
|
// Start / Stop Logik (optional aber empfehlenswert)
|
||||||
|
const chipInterval = setInterval(createChip, 300);
|
||||||
|
|
||||||
|
// optional: nach 30 Sekunden stoppen
|
||||||
|
setTimeout(() => {
|
||||||
|
clearInterval(chipInterval);
|
||||||
|
}, 30000);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue