How can I move the rectangle

Question

I wanted to move the rectangle relative with the button I click.But I don't have any clue why it's not working
https://code.sololearn.com/W31LVGRx9usd/?ref=app

Answer 1

Change line 42 - 51 to this:

var button=document.getElementById ("buttony").addEventListener ("click" , function() {
moveUp=setInterval(function (){
if(posY<0){
clearInterval(moveUp);
return;
}
posY-=1;
ctx.fillStyle="Blue";
ctx.fillRect (posX,posY,70,70);
ctx.strokeStyle="white";
ctx.lineWidth=5;
ctx.strokeRect (posX,posY,70,70);
},30)
});

//then figure out where you went wrong

Answer 2

You need functions for all buttons yes, but the code will slightly change for each button.

-Take note how the "posY" gets decreased for the up button.
-Take note how an if statement stops the square from moving up when the "posY" is less than 0.
-Take note that I didn't include any code for "posX" for the up button.
-Take note of all these changes I made in the code.

You should be able to figure this out now.

Answer 3

I appreciate it so much
but do I have to duplicate the code for all buttons.