HTML and CSS Reference
In-Depth Information
case
39
:
// Move Right
me
.
moveX
(
me
.
leftPos
+
5
,
'right'
);
break
;
case
38
:
// Move Up
me
.
moveY
(
me
.
topPos
-
5
,
'up'
);
break
;
case
40
:
// Move Down
me
.
moveY
(
me
.
topPos
+
5
,
'down'
);
break
;
}
});
As you can see, the code is very simple. When the user presses the up or down arrow, I call
the
moveY()
function, and when they press right or left, I call
moveX()
.
A quick peek at one of them reveals all the magic:
moveX
:
function
(
x
,
dir
) {
var
player
=
this
.
player
;
var
canMove
=
this
.
canImove
(
x
,
null
);
if
(
canMove
){
this
.
leftPos
=
x
;
player
.
animate
({
'left'
:
x
+
'px'
},
10
);
}
if
(
dir
==
'left'
) {
this
.
startMoving
(
'left'
,
2
);
}
else
{
this
.
startMoving
(
'right'
,
3
);
}
}
At each step the player takes, I check with a special method named
canImove()
(i.e. “Can I
move?”) to determine whether the character may move over the game canvas. This method
