Compatibilité du navigateur dans jQuery

Question

J'ai créé une petite page Web, où je voudrais animer le contenu en utilisant jQuery pendant la navigation. Cela fonctionne parfaitement dans Internet Explorer. Si j'utilise Firefox, cela ne fonctionne pas correctement.

Mon code est le suivant

$("#maincontent").animate({"top":"450px"},800, function(){ 
    $("#maincontent").html($("#"+Lidentity).html()) 
     .animate({"top":"-10px"},600) 
     .animate({"top":"10px"},100) 
     .animate({"top":"-5px"},100) 
     .animate({"top":"5px"},100) 
     .animate({"top":"0px"},100); 
}); 

J'ai mis la position de l'élément #maincontent absolu.

Answer 1

Si vous essayez de donner l'impression que votre animation rebondit, il vaut mieux utiliser les facilités de l'interface utilisateur jQuery.

Exemple (en fonction de votre code):

$("#maincontent").animate({"top":"450px"},800, function(){ 
    $("#maincontent").html($("#"+Lidentity).html()) 
     .animate({"top":"0px"},800,"easeOutBounce"); 
}); 

Il est évident que pour que cela fonctionne, il faut également ajouter une référence à jQuery.UI (soit le faisceau complet ou au moins effects.core.js & effets .bounce.js)