I am creating a small game in HTML5. The canvas element is a viewport to the game world. The user can move the viewing position in the world by clicking and dragging the mouse over a small icon.
The problem is that scrolling stops when the mouse cursor hits the edge of the screen. In all likelihood, this will severely limit scrolling in one of the directions, since the icon will be in one of the corners of the page.
The only technical solution I can think of is to somehow fix the position of the mouse pointer on the icon and determine the relative motion of each frame. Basically, I would just reset the pointer position back to the center of the icon after each drag event. Unfortunately, I'm pretty sure this is not possible. Playback with a user guide is great, but not in terms of usability and security.
So, is there any other way to do what I want? I'm primarily looking for technical ideas, but suggestions for a more suitable interface are also welcome.
source
share