JQUERY anime Delay?

Question

J'utilise JQUERY animate pour montrer une bannière en haut de la page, qui est un DIV qui est placé au -60 pour le cacher. J'utilise l'appel de JS ci-dessous pour afficher la div:

// Animation 
$('#message-dock').animate({ 
    top: 0 
}, 500, function() { 
    // Animation complete. 
}); 

Ce que je ne peux pas comprendre est pour une raison quelconque il y a un retard indésirable avant que je commence à voir la div et je ne peux pas comprendre pourquoi ? Des idées?

Answer 1

Pourquoi ne pas simplement définir le CSS de la div à display:none; et ensuite utiliser $("#message-dock").show('slow'); quand vous voulez l'afficher? Fonctionne sans "lent", ou avec "rapide" aussi.

Answer 2

Je suis d'accord avec Scott, votre retard est lié au moment où le script est exécuté. Si vous n'attendez pas un état prêt, je placerais le script directement sous l'élément html # message-dock; Cependant, si vous essayez d'animer pendant que d'autres scripts sont en cours d'exécution, "ne sera pas" une animation propre. Utilisez un CDN pour télécharger jquery.js http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js placez jquery.js avant le script qui anime # message-dock ... il faudra que jquery le télécharge avant le html donc un Content Delivery Network (CDN) est la meilleure solution. Ce qui peut arriver quand d'autres scripts s'exécutent: L'animation commence, avant que tout le reste ait téléchargé ... un autre script est en cours d'exécution qui prend quelques instants jusqu'à ce que l'animation soit bloquée ... l'animation vérifie pour voir Jusqu'où bas détermine le sommet à zéro et l'affiche sans aucune animation - juste une apparence retardée.

Pour avoir une idée de la façon dont votre page est en cours de téléchargement, vous pouvez utiliser retard indésirable http://www.webpagetest.org/