Question sur les animations en js

Résolu
Signaler
Messages postés
249
Date d'inscription
jeudi 17 février 2005
Statut
Membre
Dernière intervention
29 août 2011
-
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
-
Bonjour,

Ma question est simple, j'aimerai savoir la base d'une animation en JS. C'est a dire comment créer un timer qui je pense est le moteur de base d'une animations en JS.

J'ai bo chercher je ne trouve rien a ce sujet.

Merci, bye

Web master LFGTR - RACE24H
http://www.exile.fr

6 réponses

Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
Bonjour,

    >>C'est a dire comment créer un timer
          setInterval ou setTimeout
          une doc ? selfHTML

    mais loin d'être sûr que ce soit la base d'une animation en js !




<hr />                Cordialement            Bul         «mon Site»     «M'écrire»
Messages postés
249
Date d'inscription
jeudi 17 février 2005
Statut
Membre
Dernière intervention
29 août 2011

Merci pour ta réponse, j'ai un peu plancher et fais un truc qui commence a ressembler a quelques chose.

J'ai un anim (en gros, un div qui se dimensionne petit à petit jusqu'a un valeur de hauteur X). Probléme, c'est que c'est pas mal sacadé! c'est pas franchement estétique !

Tu n'aurai pas un truc a me donner pour évité ceci ?

Merci

Web master LFGTR - RACE24H
http://www.exile.fr
Messages postés
249
Date d'inscription
jeudi 17 février 2005
Statut
Membre
Dernière intervention
29 août 2011

Voila mon code :

anim(100, 500, 700, false, false, false);

function anim(timming, h, w, i, statusH, statusW) {
    if (!i) {
        var statusH = 0;
        var statusW = 0;
       
        document.getElementById('iframeDiapos').width=0;
        document.getElementById('iframeDiapos').height=0;
        document.getElementById('newDiapos').style.display='block';
        setTimeout("anim(" + timming + ", " + h + ", " + w + ", true, " + statusH + ", " + statusW + ")", timming);
    } else {
        var timeH = (h/timming+statusH)/4;
        var timeW = (w/timming+statusW)/4;
       
        statusH += timeH;
        statusW += timeW;
               
        document.getElementById('iframeDiapos').width=statusW;
        document.getElementById('iframeDiapos').height=statusH;
        if (statusH < h) {
        timer = setTimeout("anim(" + timming + ", " + h + ", " + w + ", true, " + statusH + ", " + statusW + ")", timming);
        } else {
            clearTimeout(timer);   
            return true;
        }
    }   
}

Web master LFGTR - RACE24H
http://www.exile.fr
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
Bonjour,
   
    tu utilise statusH et statusW, qui ne sont définis qu'en local,
       donc n'existent que si i=false ( erreur quand true ? )

    peut-être des améliorations ?
      
evite le if (!i)
       variable globale à la place de getElementById à chaque fois
       définition de la variable timer
      
    jouer sur le delta des tailles, le timeOut...

    mais bon...



<hr />                Cordialement            Bul         «mon Site»     «M'écrire»
Messages postés
249
Date d'inscription
jeudi 17 février 2005
Statut
Membre
Dernière intervention
29 août 2011

non aucune erreur, le script marche impec masi c'est sacadé, j'ai essayer plus time etc. ca change pas grand chose !

T'a une autre solution que ca ?

Je t'avouerai que je connais pas ce coté du javascript. Tu pourrais peut etre m'aiguiller ?

Web master LFGTR - RACE24H
http://www.exile.fr
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
>>le script marche impec

        1° tu as vérifié les erreurs ?
¡————————¡——————————————————————————————————————————————————————————¡
|FireFox |regarder la "console d'erreurs" |
| | Outils / Console d'erreurs |
| | |
| | et mieux, télécharger FireBug |
¦————————¦——————————————————————————————————————————————————————————¦
|Internet|activer le deboggage : Outils/options Internet/Avancés |
|Explorer| dans la liste, sous "Navigation" : décocher |
| | ° Afficher une notification de chaque erreur de script |
| | ° Désactiver le débogage de Scripts (Internet Explorer) |
| | |
| | et mieux, télécharger le Debogger IE |
¦————————¦——————————————————————————————————————————————————————————¦
|K—Meleon|regarder la "console d'erreurs" |
| | Outils / Console d'erreurs |
¦————————¦——————————————————————————————————————————————————————————¦
|Opera |regarder la "console d'erreurs" |
| | utils / Asole d'erreurs |
¦————————¦——————————————————————————————————————————————————————————¦
|Safari |regarder Debug / Show JavaScript Console |
| | |
| |modif Fichier "Support:\Documents and Settings\utilisateur|
| |\Application Data\Apple Computer\Safari\Preferences.plist"|
| | y ajouter <key>IncludeDebugMenu</key> |
| | <true/> |
!————————!——————————————————————————————————————————————————————————!

    2° essayer les suggessions...

<hr />                Cordialement            Bul         «mon Site»     «M'écrire»