Why Mario is moving in left direction only


The up, down and right arrow key is not working only left arrow key is working.

$(document).ready(function() {
$(document).keydown(function(key) {
switch(parseInt(key.which,10)) {
// Left arrow key pressed
case 37:
$('img').animate({left: "-=10px"}, 'fast');
// Up Arrow Pressed
case 38:
$('img').animate({up: "-=10px"}, 'fast');
// Right Arrow Pressed
case 39:
$('img').animate({right: "-=10px"}, 'fast');
// Down
case 40:
$('img').animate({down: "-=10px"}, 'fast');


The .animate() method allows us to create animation effects on any numeric CSS property.

check the .css your file.there are two properties left and top .

 left: 0;
 top: 0;

so if you use up and down or right then it'll not work.

for left arrow - 10px from the value it has

left: "-=10px"

and for right arrow do the opposite.add 10px to the value

left: "+=10px"

Do the same for the top.play with it and try to understand :slight_smile:


and bear in mind that even it we had right and bottom properties it would only matter if our object came in touch with those boundaries. If it did (meaning a large object), it would have a bearing on the dimensions, only, but luckily it does not. As animation goes, the top and left boundaries are the only real references in the plane.


This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.