Hi all, im new and learning JS and trying to build pong. im following a tutorial but trying to change it.
the line im stuck on is trying to move the paddle when the mouse moves
document.body.addEventListener("mousemove", mouseMoveHandler);
function mouseMoveHandler(event) {
//console.log(event);
player.setY(event.clientY - player.getHeight() /2);
}
This works with the assumption that my canvas takes up the entire screen
the tutorial has the canvas full browser, mine is only 800 x 400 and is centered.
how can i get this to only moe and register when im on the canvas? at the moment i can enter the browser and it starts moving even though my mouse is nowhere near it.
----------------------------------------------------------------------
Fixed it
i have a div the same size as the canvas called holder so i did:
holder.addEventListener("mousemove", mouseMoveHandler);
function mouseMoveHandler(event) {
//console.log(event);
holder.style.cursor = "none";
player.setY(event.clientY - player.getHeight() *2 );
}