Sujet Précédent Sujet Suivant

Javascript fait ramer le PC !, Translater un gif animé

Sarvok Messages postés 8 Date d'inscription jeudi 22 juillet 2004 Statut Membre Dernière intervention 3 mars 2007 - 2 mars 2007 à 13:34
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 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 ?

<!--IBF.ATTACHMENT_1789244-->

7 réponses

Réponse 1 / 7
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
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>

;0)
0
Réponse 2 / 7
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
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à...





<hr />



Cordialement            Bul         [mon Site]     [M'écrire]           




<hr />
0
Réponse 3 / 7
Sarvok Messages postés 8 Date d'inscription jeudi 22 juillet 2004 Statut Membre Derniè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 ?
0
Réponse 4 / 7
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
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...

<hr />


Cordialement                Bul             [mon Site]         [M'écrire]           




<hr />
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 7
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
3 mars 2007 à 07:09
le var toto=, au même endroit que le var xm=
le gain, si gain il y a ? ne sera probablement pas mesurable...
<hr />


Cordialement        Bul         [mon Site]     [M'écrire]           




<hr />
0
Réponse 6 / 7
Sarvok Messages postés 8 Date d'inscription jeudi 22 juillet 2004 Statut Membre Derniè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 ***
0
Réponse 7 / 7
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
3 mars 2007 à 13:26
essayer et tester....
copie de la solution de PetoleTeam :




<script type='Text/Javascript'>




function bonhommeOK()
{
  x+=2;                     //



on pourrait faire le test avant d'additionner




  if( x >xm )    x 0;   // mais alors là... le gain ???
  toto.style.left = x +"px";
}




var x=0;
var xm = screen.width-23;
var toto=



document.getElementById('BH');





var timer = setInterval('bonhommeOK()', 100);
</script>








je serais surpris que cela fasse gagner un temp mesurable...



<hr />



Cordialement            Bul         [mon Site]     [M'écrire]           




<hr />
0

Discussions similaires

image gif dans un programme MFC
ventreapatte -
ventreapatte -

4 réponses
Script affichage plusieurs gif position aléatoire + refresh
manui31804 -
manui31804 -

2 réponses
autre façon d'insérer un GIF animé ? ( Excel )
Bruno_65 -
Bruno_65 -

8 réponses
Animation gif pour chargement qui bloque
Portos67 -
Calade -

26 réponses
.Net Gif transparent
cs_liquide -
liquide -

4 réponses
Rejoignez-nous