3 votes

Suppression du "problème" de chargement de la page pendant l'exécution de jQuery

Les utilisateurs de mon site voient un un problème d'une demi-seconde sur chaque page avant l'exécution de tout code jQuery. Ce code manipule la page de manière à ce que l'on puisse voir les éléments se déplacer en une seule fois, ce qui rend l'expérience de l'utilisateur difficile. Je préférerais que la page ne s'affiche pas du tout tant que le JavaScript n'a pas été exécuté.

J'utilise jQuery fourni par l'API Google dans une page comme suit :

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load("jquery", "1.3.2");
</script>
<script type="text/javascript" src="MyScript.js"></script>

Dans MyScript.js :

google.setOnLoadCallback(runOnLoad);    
function runOnLoad() {
    // Do stuff
}

Quelqu'un sait-il s'il est possible d'exécuter le JavaScript avant l'affichage de la page dans le navigateur ?

7voto

Jan Aagaard Points 5218

Vous pourriez probablement ajouter une classe css à votre div principal qui masquerait le contenu, puis supprimer cette classe comme dernière action de MyScript.js.

Dans votre modèle html :

<body>
    <div id="mainContent" class="hidden">
    </div>
</body>

La classe css :

.hidden
{
    display: none;
}

Dernière déclaration exécutée de MyScript.js :

$("#mainContent").removeClass("hidden");

0voto

jerjer Points 5585

Je suis d'accord avec Jan.

La plupart des navigateurs (pas tous) chargent d'abord les CSS avant les javascripts. Les CSS sont donc recommandés pour vous.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X