Javascript fait ramer le PC !, Translater un gif animé
Sarvok
Messages postés8Date d'inscriptionjeudi 22 juillet 2004StatutMembreDernière intervention 3 mars 2007
-
2 mars 2007 à 13:34
cs_bultez
Messages postés13615Date d'inscriptionjeudi 13 février 2003StatutMembreDernière intervention15 octobre 2013
-
3 mars 2007 à 13:26
Hello l'INpactitude,
Sur
le site que je développe pour une assoc', j'ai mis un bonhomme qui
court le long d'une barre. En fait à la base c'est un gif animé que je
translate avec du Javascript :<!--c1-->
CODE
<!--ec1--><script language='Javascript'>
var x=-23;
var xm =screen.width-23;
var timer=setInterval('bonhommeOK()', 100);
function bonhommeOK(){
x+=2;
if(x >= xm)
x=-23;
if (document.all) {
document.getElementById('BH').setAttribute('cssText', 'position:absolute;left:'+x+'px;top:60px');
}else{
document.getElementById('BH').setAttribute('style', 'position:absolute;left:'+x+'px;top:60px');
}
}
</script><!--c2-->
<!--ec2-->
Bref, rien d'extraordinaire. Pourtant ça fait ramer certains PC .... Que faire pour lutter contre ça ? Mon code est mal écrit ?
PetoleTeam
Messages postés3426Date d'inscriptionlundi 26 décembre 2005StatutMembreDernière intervention14 janvier 201117 2 mars 2007 à 14:03
B onjour...
Evites d'utiliser des fonctions gourmande de temps comme setAttribute qui fait du traitement de chaîne.
Utilise le BaBA de l'animation comme par exemple
<script language='Javascript'>
var x =-23;
var xm = screen.width-23;
var timer = setInterval('bonhommeOK()', 100);
function bonhommeOK(){
x += 2;
if( x >= xm)
x = -23;
document.getElementById('BH').style.left = x +"px";
}
</script>
cs_bultez
Messages postés13615Date d'inscriptionjeudi 13 février 2003StatutMembreDernière intervention15 octobre 201330 2 mars 2007 à 14:06
Bonjour,
euh... "ça marche pas" avec IE....
>>Bref, rien d'extraordinaire.
non, non, un traitement (lourd) toutes les 100 milli-secondes.
qui plus est avec une foultitude de choses du style :
test document.all, getElementById, setAttribute.... ( gourmand )
>>Que faire pour lutter contre ça ?
jouer directement sur style.left
mais, à mon humble avis : ne plus mettre cette animation.
>>Mon code est mal écrit ?
je n'irais pas jusque là...
Sarvok
Messages postés8Date d'inscriptionjeudi 22 juillet 2004StatutMembreDernière intervention 3 mars 2007 2 mars 2007 à 18:09
J'ai fais avec style.left et ça va mieux.
Cepdant j'aimerais faire un
var xObj = document.getElementById('BH').style.left
ou
var obj = document.getElementById('BH');
Déclaration sortie de la fonction afin de ne pas refaire ça toutes les 100 ms. Cependant que je le déclare avec ou sans le mot clé var ça ne fonctionne pas. Quel est le probleme ? J'aurais cru portée de variable, non ?
cs_bultez
Messages postés13615Date d'inscriptionjeudi 13 février 2003StatutMembreDernière intervention15 octobre 201330 3 mars 2007 à 07:07
Bonjour,
tout dépend où est fait ce "var"
dans une fonction : c'est une variable locale, utilisable
uniquement dans cette fonction
sans var, ou var en dehors d'une fonction, c'est une
variable globale, utilisable n'importe où.
dans la solution de PetoleTeam, mettre var toto=getElementById...
et dans la fonction utiliser toto.style.left...
ça ne devrait plus faire gagner grand chose...
Sarvok
Messages postés8Date d'inscriptionjeudi 22 juillet 2004StatutMembreDernière intervention 3 mars 2007 3 mars 2007 à 12:58
Mais var toto en dehors de la fonction, ça devrait faire gagner un gain comme il est lu qu'une seul fois lorsqu'on charge la page et pas tous les 100 ms ?
En tous cas changer setAttribute par style.left a fait un gain suffisant pour que ça ne rame pas chez mon maître de stage ;-). Mais j'aimerais bien essayer de gagner encore un peu en ne faisant qu'une seule fois getElement ById() *** fantasme de g33k ***