绽放的烟花 - Firework
.
.
.firework:hover,
.firework.
.firework.
@keyframes glowing {
}
const fireworks = document.querySelectorAll(".firework");
fireworks.forEach((firework) => {
firework.addEventListener("animationend", () => {
= this.getBoundingClientRect();
const explosion = document.createElement("div");
explosion.classList.add("explosion");
explosion.style.left = ${x}px;
explosion.style.top = ${y}px;
explosion.style.backgroundColor = rgba(0, 0, 0, 0.9);
explosion.style.borderRadius = 50%;
explosion.style.animation = "glowing 1.2s infinite alternate";
setTimeout(() => {
explosion.remove();
}, 1000);
});
});