Comment faire une image à déplacer en cliquant sur un bouton avec le Javascript?

J'ai besoin d'écrire un code javascript à l'intérieur d'un document HTML qui a le comportement suivant:
Quand on clique sur un bouton, une image commence à se déplacer (si elle n'est pas déjà en mouvement), d'un pixel vers la gauche par seconde. Lorsqu'un deuxième bouton est cliqué, l'image cesse de se déplacer et obtient immédiatement repositionné à ses coordonnées d'origine.

Je reçois tout fonctionne, sauf pour le "Bouton" qui dit "DÉMARRER". Pour l'instant, si je clique sur l'image, l'image se déplace de gauche de 1 pixel par seconde. Cependant j'ai besoin pour réaliser cette fonction sur le bouton DÉMARRER.

Personne ne sait comment faire cela?
Merci!!!!!

Mon code est comme suit:

<html><head>


<script>

var timerid = null;


function move()
{
document.getElementById('cat').style.right = 
    parseInt(document.getElementById('cat').style.right) + 1 + 'px';    
}

window.onload=function()
{   



document.getElementById('cat').onclick=function(){

    if(timerid == null){
        timerid = setInterval("move()", 10);
    }else{
        clearInterval(timerid);
        timerid = null;
    }
}   


var button2 = document.getElementById('button2');
button2.onclick= reloadPage;

    function reloadPage(){
        window.location.reload();
    }

}


</script>
</head>
<body>

<img id="cat" src="cat.jpg" style="position:absolute;right:5px"/>

<div>
<button id="button1" type="button" style="position:absolute;left:10px;top:190px"/>START</button>
<button id="button2" type="button" style="position:absolute;left:10px;top:220px"/>STOP & RESET</button>
</div>

</body>
</html>
  • Les choses seraient beaucoup plus facile en utilisant jQuery qui fournit cette sortie de la boîte avec .animate()
  • Merci je sais! Je ne suis pas autorisé à utiliser Jquery pour cela:(
InformationsquelleAutor tidydee | 2013-03-29
  1. 1

    changement cat à button1 

    document.getElementById('button1').onclick=function(){
                     //--^^^^^^^^----here
  if(timerid == null){
    timerid = setInterval("move()", 10);
  }else{
    clearInterval(timerid);
    timerid = null;
  }
}
    • SALUT Bipen, Vous semblez être un très bon codeur javascript. Puis-je vous demander de prendre un coup d'oeil à un autre morceau de code que j'ai du mal avec. Celui-ci pourrait être un peu un défi. J'ai passer des heures sur celui-ci et encore rien. Veuillez voir le lien: stackoverflow.com/q/15696938/2147761 Votre aide est très appréciée et je remercie yo en avance!!!!
    • ok mise à jour vous répondre, il y vérifier le violon dans la réponse.. :).. et oui si tout de la poste vous aide, alors il ne faut pas oublier de les accepter comme réponse....
    InformationsquelleAutor bipen