pourquoi jquery assouplit pas si lisse

Question

J'ai une image que je soulage avec jQuery.

<style> 

#box 
{ 
    position:relative; 
    left:-400px; 
    height:50px; 
    width:100px; 
} 

</style> 


$(document).ready(function() 
    { 
     var method; 

     $("#clickme").toggle(function() 
     { 
      method = $("#box").attr("class"); 
      $("#box").animate({left:"50%"},{duration: 1000,easing: method}); 

     },function() 
     { 
      method = $("#box").attr("class"); 
      $("#box").animate({left:"-400px"},{duration: 1000,easing: method}); 
     }); 
    }); 

Il s'agit d'environ 400x600px et le rendu de l'image glissant est lisse mais trapu.

Il lors de l'animation ressembler à ceci parfois:

|   | 
|   | 
    |   | 
    |   | 
|   | 
|   | 

Si | sont les bords de l'image. Est-ce juste à cause des capacités de rendu de mes navigateurs/ordinateurs? Chrome/FF/Safari sur un netbook.

Answer 1

Il semblerait que vous rencontriez les limites de votre combinaison navigateur/matériel. Gardez à l'esprit que les animations javascript dépendent fortement des capacités de l'ordinateur et du moteur javascript de votre navigateur.

Quelque chose qui semble bien sur un poste de travail haut de gamme ne sera probablement pas si bien sur un ordinateur portable bas de gamme.

Answer 2

Etes-vous en cours d'exécution Flash sur la même page?

Si tel est le cas, j'ai rencontré quelques problèmes lors de la combinaison de JQuery et de Flash sur la même page et ils peuvent générer de gros résultats. Habituellement, le Flash est transparent pour vraiment toucher l'ordinateur.

Pour clarifier, l'image «saute» lorsqu'elle se charge ou l'image elle-même se charge-t-elle mal? S'il saute, il pourrait s'agir d'un simple problème CSS - qui peut être résolu si je peux voir ce que vous avez pour votre CSS. Si ce n'est pas le cas et que c'est l'image, Justin pourrait l'avoir résolu pour vous. Êtes-vous capable de tester sur un ordinateur plus puissant?