impossible d'ajouter spinner de chargement de page lors de l'ouverture d'un nouvel onglet dans dsp (pages serveur dynamiques)

Question

J'essaie d'ajouter un spinner de chargement de page lorsque je clique sur un lien de page dsp (pages dynamiques du serveur). J'ai essayé les fonctionnalités onload et div comme spécifié dans d'autres threads, mais le spinner arrive juste avant que le corps de la page ne charge et ne disparaisse. Pour être plus clair, quand je clique sur le lien, il y a une page vierge jusqu'à ce que la page se charge, et juste avant que le corps soit chargé sur la page, le spinner démarre et reste sur la page.

Quelqu'un pourrait m'aider s'il vous plaît où, lorsque je clique sur le lien, le spinner devrait être là jusqu'à ce que la sortie de service (corps) est affichée sur la page.

Cordialement Harish

Answer 1

Créer la fileuse de chargement avec juste HTML et CSS. Chargez votre javascript au bas de la page et sélectionnez le spinner par identifiant et cachez-le. Cela permettra d'assurer que le fileur est montré le plus tôt possible dans le processus de chargement et caché/estompé après le chargement de la page et du javascript.

Si vous utilisez jquery--

$("#spinner").fadeOut("slow"); 

De votre question, il semble que vous utilisez javascript pour afficher la fileuse et qui est la raison pour laquelle il est affiché juste avant la page se termine le chargement et non en c'est le chargement.

EDIT: Voici un codepen avec un exemple de travail .-- http://codepen.io/anon/pen/XKoqZq J'ai caché le reste de la page dans le css avec la propriété display:none. C'est optionnel mais cela fait apparaître toute la page à la fin du chargement.