Chargement de la page avant affichage

Bonjour j'ai réalisé un site sur une seul page avec différents page php qui s'affiche sur celle-ci. Mais les pages mettant un peu de temps à charger je rencontre certains bug lors de l'affichage. J'aimerai savoir s'il est possible en Jquery de charger tout le site avant de l'afficher ou afficher la première page et charger toutes les autres, ou alors de faire une barre de chargement.
J'ai entendu parlé de la fonction load ou preload mais je ne comprend pas comment l'appliquer à mon site. Merci de votre aide.

:)

Techniquement c'est possible, mais c'est pas très conseillé. Mais avec de l'ajax, oui, tu peux initialement charger une page allégée et récupérer le reste au fur et à mesure et l'injecter dans ta page.

Mais sérieusement, c'est une mauvaise idée. Trouves plutot pourquoi tes pages mettent du temps à charger (images trop lourdes? Trop de requetes sql?) et corriges ca. On peux aussi t'aider avec les bugs d'affichages si tu les décrits un peu plus.

En faite, c'est le css qui charge lentement je pense, quand la première page s'affiche l'image se trouve en haut de la page puis elle se centre c'est ce que j'aimerai éviter. Merci

Effectivement ca pourrait indiquer un problème de css. Tu en as beaucoup des fichiers css? Ils pèsent combien? Ils sont placés à quel endroit dans ton html?

Eh bien ce code, tu le mets soit en dur à la fin de ta page entre des balises <script>, soit plus proprement dans un fichier JS à part appelé en fin de page.

Ensuite, il faut que tu choisisses ce que tu vas mettre avant le chargement de ta page, c'est-à-dire un logo, ou un gif animé... (un vrai loader est déjà un peu plus compliqué).
Tu initialises tous tes éléments en CSS (ou en JS au document.ready), c-à-d ton logo qui apparait et le reste caché.
Et enfin au window.load, tu caches ton logo et fais apparaitre le reste...

$(window).load(function () {
  $('#monLogo').fadeOut()
  $('#leResteDeMonContenu').fadeIn()
});

Un truc du genre...