Comment définir l'icône de chargement pour la transition entre les pages? - javascript, php, jquery, html, chargement

$(window).load(function() {
$("#loading").hide();
$("#container").show();
});

Dans tout mon fichier php, j'ai le code mentionné ci-dessus pour afficher l'icône de chargement jusqu'au chargement de la page. Par exemple: si j'exécute index.php, l’icône de chargement sera affichée jusqu’à index.php obtient complètement chargé.Si il est redirigé vers example.php lors de la redirection, aucune icône de chargement ne s’affiche, elle est totalement vide. Et si elle est entièrement redirigée, l'icône de chargement s'affiche jusqu'à ce que la page se charge complètement.

Attendu: Lors de la redirection vers la page suivante, il faut également que l'icône de chargement s'affiche.

alors Comment afficher l'icône de chargement entre les transitions de pages?

Réponses:

L'astuce consiste à démarrer l'icône de chargementimmédiatement lorsque la page est déchargée. Ensuite, lorsque la nouvelle page est chargée, l’icône de chargement doit être réapparue immédiatement, puis lorsque la nouvelle page est entièrement chargée, l’icône peut être masquée.

// Show the icon immediatly when the script is called.
$("#loading").show();

// show the icon when the page is unloaded
$(window).on("beforeunload", function(event) {
$("#loading").show();
});

// hide the icon when the page is fully loaded
$(window).on("load", function(event) {
$("#loading").hide();
});