How to take control and/or remove the cursor?

p5.js Coding Questions
1

Is there a way to ‘listen to’ where the mouse wanted to move even if there is no place for it? Basically telling the program the same data the touchpad or mouse would give the device.

I’ve seen cases where the page asked for cursor control.

My goal is to create a 2D environment where the camera would spin at the corresponding direction as the mouse is moved.
I thought one of my solutions could be making the cursor invisible with noCursor(), and at the end of every frame moving the mouse back to it’s normal place (meaning that there would be enough space for any movement and calculating the mouseXY before placing back.)

I couldn’t figure out how to do any of the listed above, so help would be very appreciated.

1 Like
2
3 Likes
3

In Processing the robot class allows this

Not sure about p5js

1 Like
4

Look into the pointer lock api. It’s not integrated with p5 as far as I know and I’m not sure that all browsers support it but it’s pretty much exactly what you’re looking for.

Due to security I think you have to get the user to click before it starts working like making a browser full screen. Also it’s esc to get out of it.

I remembered seeing it in something made in three.js and I couldn’t find what I was thinking of but I did find this demo.

2 Likes