I got this code from somewhere on the internet but can’t find a reference for it. If you created the code I’ll be happy to add a link. Thank you
/* This function makes sure nothing is displayed until the whole page is loaded */
document.onreadystatechange = function() {
/*JS code */
if (document.readyState !== "complete") {
document.querySelector("body").style.visibility = "hidden";
document.querySelector("#loader").style.visibility = "visible";
} else {
document.querySelector("#loader").style.display = "none";
document.querySelector("body").style.visibility = "visible";
}
};
/* CSS code*/
/* page loading spinner */
#loader {
border: 12px solid #f3f3f3;
border-radius: 50%;
border-top: 12px solid #444444;
width: 70px;
height: 70px;
animation: spin 1s linear infinite;
}
@keyframes spin {
100% {
transform: rotate(360deg);
}
}
.center {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
/*html*/
... code above
<body>
<div id="loader" class="center"></div>
.. website code
</body>