Mettre mon loader seulement pour charger ma page
Résolu
arcadenaker
Messages postés
61
Date d'inscription
Statut
Membre
Dernière intervention
-
arcadenaker Messages postés 61 Date d'inscription Statut Membre Dernière intervention -
arcadenaker Messages postés 61 Date d'inscription Statut Membre Dernière intervention -
Bonjour à tous,
j'aimerais faire en sorte que le loader s'enlève quand toute la page a chargée et qu'il ne dépende pas d'un "setTimeout" de 4 secondes car je trouve que c'est inutile de faire attendre 4 bêtes secondes si la page est déjà chargée avant. Voici mon code ci-dessous:
j'aimerais faire en sorte que le loader s'enlève quand toute la page a chargée et qu'il ne dépende pas d'un "setTimeout" de 4 secondes car je trouve que c'est inutile de faire attendre 4 bêtes secondes si la page est déjà chargée avant. Voici mon code ci-dessous:
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#spinner{
width: 120px;
height: 120px;
background: transparent;
border-left: 10px solid gray;
border-right: 10px solid gray;
border-top: 10px solid lightgreen;
border-bottom: 10px solid gray;
position: absolute;
left: 50%;
top: 50%;
margin-left: -60px;
margin-top: -60px;
border-radius: 50%;
animation: loader 1.5s linear infinite;
}
@keyframes loader{
100%{
transform: rotate(360deg);
}
}
</style>
</head>
<body>
<div id="spinner"></div>
<script type="text/javascript">
<!-- C'est le setTimeout que je vous parlais -->
var loadpage = setTimeout(loadpage,4000);
function loadpage(){
document.getElementById('spinner').style.display = 'none';
document.getElementById('page-content').style.display = 'block';
}
</script>
<div id="page-content"></div>
</body>
</html>
A voir également:
- Ajouter un loader pendant le chargement de vos pages web css
- Web office - Guide
- Creation de site web - Guide
- Windows loader - Télécharger - Gestion de fichiers
- Impossible de supprimer une page word - Guide
- Comment traduire une page web - Guide
Merci beaucoup pour ta réponse et c'est vrai que c'est une bonne idée, j'ai réussi à faire ce que je voulais avec ça.
$(document).ready(function() { document.getElementById('spinner').style.display = 'none'; document.getElementById('page-content').style.display = 'block'; });Bonne journée
...script
}
car au moins ça n'oblige pas de charger les 400ko de JQuery, enfin les 2 marchent mais pour du préchargement rajouter du temps de chargement me semble pas le plus optimisé ;)
Merci pour vos réponse.