Animation javascript

Résolu/Fermé
Pomme87 Messages postés 38 Date d'inscription vendredi 22 juillet 2011 Statut Membre Dernière intervention 4 décembre 2011 - 14 nov. 2011 à 20:41
Pomme87 Messages postés 38 Date d'inscription vendredi 22 juillet 2011 Statut Membre Dernière intervention 4 décembre 2011 - 16 nov. 2011 à 19:14
Bonsoir,
J'ai un petit souci avec la manipulation des propriétés d'objets. J'ai bidouillé (code repris du siteduzero) le code ci-dessous et l'image ne change pas sa taille. Quelqu'un aurait-il une idée ?

var myImg = document.getElementById('myImg').width;

function anim() {

myImg = myImg - 20;

if ( myImg > 200 ) {
setTimeout(anim, 40); // La fonction anim() fait appel à elle-même si elle n'a pas terminé son travail
}

}

anim(); // Et on lance la première phase de l'animation !


A voir également:

3 réponses

vincent170186 Messages postés 316 Date d'inscription mardi 17 mars 2009 Statut Membre Dernière intervention 28 septembre 2012 52
14 nov. 2011 à 21:39
salut !
dans ta fonction tu récupère la taille de #myImg ,
tu lui enleve 20
et tant que img supérieur a 200

tu recomences (tous les 40 ms)
tu enleves 20 (donc debut le debut ça la taillle -40);
et ainsi de suite jusqu'a ce que #myImg inferieur a 200;

le soucis c'est que cette valeur tu ne la réatribut pas a ton images,
tu manipule une variable. pas la taille de l'image , uniquemnt sa valeur.

en js brute je serais pas te dire , j'utilise des librairie (jquery )
ça peut etre plus sympas a utilsé

tu apelles la librarie dans une balsie script
--> https://jquery.com/
et aprés ça donne ça


$(document).ready(function() {
$("##myImg").animate({
width: "200"
}, 500 , );
});

-->http://jquery.developpeur-web2.com/documentation/effets/animate.php



et sinon sur firefox utilise ta console d'erreur .


0
vincent170186 Messages postés 316 Date d'inscription mardi 17 mars 2009 Statut Membre Dernière intervention 28 septembre 2012 52
15 nov. 2011 à 15:43
erratum :

$(document).ready(function() {
$("#myImg").animate({
width: "200"
}, 500 , );
});
0
Utilisateur anonyme
14 nov. 2011 à 22:12
salut ca ne serait pas par hazard un document.getElementById('myImg').style.width;
0
Pomme87 Messages postés 38 Date d'inscription vendredi 22 juillet 2011 Statut Membre Dernière intervention 4 décembre 2011
16 nov. 2011 à 19:14
Trouvé :

var myImg = document.getElementById('menu');
myImg.style.height=myImg.offsetLeft;


function anim() {


if (myImg.offsetLeft<=1000)
{
setTimeout(anim, 40); // La fonction anim() fait appel à elle-même si elle n'a pas terminé son travail
}

myImg.style.left=myImg.offsetHeight + 1;
}

anim(); // Et on lance la première phase de l'animation !
0