Bonjour,
J'ai voulu aujourd'hui et pour la première fois m'essayer à l'utilisation d'un loader sur mon site qui est déjà bien avancé dans sa conception mais j'ai rencontré 2 problèmes assez contraignant et je bloque un peu la, donc je viens demander un peu d'aide
1er problème : Une fois arrivé sur le site (donc après le chargement du loader) on tombe sur la section 1 qui est un background en cover fixed à width et height 100%, j'ai également un background en cover pour mon footer à height 60% et width 100%.
Concernant ces background, sans loader ils n'ont aucun problème de comportement mais avec, une fois que la page s'affiche ils perdent leur height respective et sont "tassés" si je peux dire ça comme ça.
2ème problème : Quasiement tout le site est censé s'afficher petit à petit avec des waypoints, encore une fois pas de soucis sans loader, mais avec, soit quand je les cachent avec un display: none alors au réaffichage les sections sont présentes sur tout le site sans waypoints, ou alors avec un visibility: hidden les waypoints fonctionnent encore sauf qu'on peut scroll la page pendant le loading, donc ce qui a été scroll à ce moment la ne peut pas être découvert par la suite au fur et à mesure du scroll (Je sais pas si c'est très clair
)
J'ai pas mal de lignes de code sur le site donc je sais pas trop ce qui pourrait aider à comprendre... Mais je met au moins ce que j'ai utilisé pour le loader, si besoin je mettrais plus sur demande.
Merci à qui voudra bien venir me sauver !
Modifié par Midnight17 (08 Jul 2017 - 16:04)
J'ai voulu aujourd'hui et pour la première fois m'essayer à l'utilisation d'un loader sur mon site qui est déjà bien avancé dans sa conception mais j'ai rencontré 2 problèmes assez contraignant et je bloque un peu la, donc je viens demander un peu d'aide
1er problème : Une fois arrivé sur le site (donc après le chargement du loader) on tombe sur la section 1 qui est un background en cover fixed à width et height 100%, j'ai également un background en cover pour mon footer à height 60% et width 100%.
Concernant ces background, sans loader ils n'ont aucun problème de comportement mais avec, une fois que la page s'affiche ils perdent leur height respective et sont "tassés" si je peux dire ça comme ça.
2ème problème : Quasiement tout le site est censé s'afficher petit à petit avec des waypoints, encore une fois pas de soucis sans loader, mais avec, soit quand je les cachent avec un display: none alors au réaffichage les sections sont présentes sur tout le site sans waypoints, ou alors avec un visibility: hidden les waypoints fonctionnent encore sauf qu'on peut scroll la page pendant le loading, donc ce qui a été scroll à ce moment la ne peut pas être découvert par la suite au fur et à mesure du scroll (Je sais pas si c'est très clair
)J'ai pas mal de lignes de code sur le site donc je sais pas trop ce qui pourrait aider à comprendre... Mais je met au moins ce que j'ai utilisé pour le loader, si besoin je mettrais plus sur demande.
Merci à qui voudra bien venir me sauver !
/* HTML */
<div class="preload">
<img src="Images/loading-spinner.gif" alt="'Chargement de la page...'"/>
</div>
/* Cette div est situé juste après le body, tout le reste du site est compris dans une div qui sert à cacher la page */
/* CSS */
#showPage { display: none; } /* Ou avec visibility: hidden */
.preload
{
margin: 0;
z-index: 9999;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
cursor: wait;
}
$( document ).ready(function()
{
$(".preload").fadeOut(4000,function()
{
$("#showPage").fadeIn(1500);
});
});
Modifié par Midnight17 (08 Jul 2017 - 16:04)
