Capturing mouse position outside of browser window?

问题

One major barrier to creating immersive experiences in the browser (using WebGL and similar) is the set of limitations placed on mouse control.

For instance a first person shooter control scheme essentially requires the program to grab the mouse and re-center it so as to allow infinite movement in any direction for the cursor. This is a no-no because it would give the web programmer too much control. Hopefully one day we will see a plugin that allows a site to request permission to move the mouse to allow this behavior.

However I think there are some ways to improve things without going that far. I am wondering if it's possible to allow access to the mouse position once the mouse moves off of the window (focus is still on window)?

I was playing this game using Google Chrome: http://www.chromeexperiments.com/detail/x-wing/?f=

and my biggest issue was that to get to a corner, I have to carefully keep my mouse on the corner of the browser window. If I push it off the window my ship would stay where the mouse's last window position was, which is not exactly in the corner. And I would crash into the wall.

To make this better, the browser should be able to receive mouse updates when the mouse is outside of the window. In the context of this type of game if the mouse leaves the window it should continue to send updated positions to the browser.

Is there any provision for this?

回答1:

That really seems like a far bigger security issue than allowing the developer to reposition the cursor. The answer is no, there's no such thing. And there probably won't ever be one. Sorry!

Update: I was, of course, talking about the capturing outside the window that would be a problem. It's very likely that there will ever be an API that locks the mouse, maybe after asking the user's permission. As nickf pointed out, they're already working on it -https://www.w3.org/TR/pointerlock/

Original defunct link - http://dvcs.w3.org/hg/webevents/raw-file/default/mouse-lock.html

回答2:

A hint :

 function thumb_mouse_down(e) {
                       e.target.setCapture();
                       return false;
                   }

 function doc_mouse_up(e) {
                        e.target.releaseCapture();
}

回答3:

setCapture() does the trick. A working example is here.

回答4:

To answer your question, no, you can't get mouse events from outside the window (including its position).

There is the Mouse Lock API, which is designed specifically for the case you describe. It locks the cursor to the current window. Support is virtually non-existent right now, but one day..!

来源：https://stackoverflow.com/questions/8226299/capturing-mouse-position-outside-of-browser-window