1
0
This commit is contained in:
matt 2025-01-31 18:12:03 +01:00
parent ed19ae5514
commit 929e62d420

View File

@ -9,13 +9,10 @@
body, html { body, html {
height: 100%; height: 100%;
margin: 0; margin: 0;
display: flex;
align-items: center;
justify-content: center;
} }
.loader-container { .loader-container {
display: flex; display: none;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 100%; height: 100%;
@ -23,9 +20,14 @@
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
background-color: rgba(255, 255, 255, 0.8); /* Optional: Ein halbtransparenter Hintergrund */ background-color: rgba(255, 255, 255, 0.8); /* Halbtransparenter milchiger Hintergrund */
z-index: 9999; /* Sicherstellen, dass die Ladeanimation immer im Vordergrund ist */ z-index: 9999; /* Sicherstellen, dass die Ladeanimation immer im Vordergrund ist */
} }
/* Ladeanimation anzeigen */
.loading .loader-container {
display: flex;
}
</style> </style>
</head> </head>
<body> <body>
@ -39,6 +41,17 @@
</div> </div>
<!-- Deine anderen Inhalte hier --> <!-- Deine anderen Inhalte hier -->
<p>Hier ist dein Hauptinhalt...</p>
<script>
// Simulieren des Ladevorgangs
document.body.classList.add('loading');
// Nach 3 Sekunden den Ladevorgang beenden
setTimeout(() => {
document.body.classList.remove('loading');
}, 3000);
</script>
</body> </body>
</html> </html>