update
This commit is contained in:
63
public/4/load.html
Normal file
63
public/4/load.html
Normal file
@@ -0,0 +1,63 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Enable/Disable Element with Loader</title>
|
||||
<style>
|
||||
/* Reset default margins and padding */
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden; /* prevent scrolling */
|
||||
background-color: rgba(0, 0, 255, 0); /* body background */
|
||||
}
|
||||
|
||||
/* Loader container covers full viewport */
|
||||
#loader {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: rgba(127, 255, 212, 0);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 9999;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="loader">
|
||||
<script>
|
||||
function getQueryParam(key, defaultValue = 0) {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const value = urlParams.get(key);
|
||||
return value !== null ? value : defaultValue;
|
||||
}
|
||||
|
||||
const show_background = getQueryParam('width_height', 0);
|
||||
const loader = document.getElementById('loader');
|
||||
if (show_background != 0) {
|
||||
loader.style.width = show_background + 'px';
|
||||
loader.style.height = show_background + 'px';
|
||||
} else {
|
||||
loader.style.width = '100vw';
|
||||
loader.style.height = '100vh';
|
||||
}
|
||||
</script>
|
||||
|
||||
<script
|
||||
src="https://unpkg.com/@dotlottie/player-component@2.7.12/dist/dotlottie-player.mjs"
|
||||
type="module">
|
||||
</script>
|
||||
<dotlottie-player
|
||||
src="https://lottie.host/1cb2c811-f2b9-4ec8-a92c-e834ad6d2be8/WVsHVPkOXw.lottie"
|
||||
background="transparent"
|
||||
speed="1"
|
||||
loop
|
||||
autoplay>
|
||||
</dotlottie-player>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user