This topic is locked

LOADING PLEASE WAIT.... before add screen loads

3/10/2024 12:42:08 PM
PHPRunner Tips and Tricks
F
Farhaad author

If your JS is too large and taking a while to load, if you wish to use the LOADING PLEASE WAIT see code below.
However i suggest you reduce the load on your JS before using this code. Its just better coding habit.

/* ** /
// LOADING PLEASE WAIT.... before add screen loads
// Add this code in the Add page "before display" event section
/
** */

// Display loading message
echo '<div id="loading-container" style="display:flex; align-items:center; justify-content:center; height:100vh; position:fixed; top:0; left:0; right:0; bottom:0; background-color:rgba(255,255,255,0.7); z-index:999;">
<div id="loading" style="display:block;">Loading, please wait...</div>
</div>';

// Set a timeout to hide the loading message after 2 seconds
echo '<script>
setTimeout(function() {
document.getElementById("loading-container").style.display = "none";
}, 2000); // 10 seconds = 10000 // 5 seconds = 5000 // 3 seconds = 3000 // 2 seconds = 2000
</script>';

/* ** */