« Air TilieList drag bug workaround | Main | Flex component clipContent problems and mask gotchas »
Tuesday
20Jan2009

Mouse events outside the browser window

The mouseX and mouseY values are not accurate outside of the web browser window (in Flex or Flash applications), the values stop at the boundaries of the stage.

However, the values do get updated if the mouse button is down. Which is an important thing to notice when creating scrollbars for a Flash application or any draggable UI element.

The other thing to notice is that MOUSE_UP events do not fire outside of the browser window, and the buttonDown property of MouseEvents stay set to buttonDown == true, even though the button was depressed outside the window.

To solve this issue, we can track the MOUSE_LEAVE event, this event usually gets fired when the cursor leaves the stage. But if the mouse button is down, the event gets fired on MOUSE_UP.

No it doesn't make a huge amount of sense but it does work in Flash and Flex, flash player v9 and v10 (probably in previous versions too).

This means that when MOUSE_LEAVE is fired, we can compare the mouse position with the stage size to determine whether the mouse button was depressed outside the browser window.

Play with the example and view the source to see how this works in more detail.

View Source

Reader Comments (2)

hey, tyvm! thats great.

but when i try to use this in a custom component, it won´t work. because my components "stage" is NULL. any idea, how to work arround this?

kws

February 10, 2010 | Unregistered Commenterkweso

now it works. don´t ask me why...

but when i use stage.addEventListener(MouseEvent.MOUSE_UP, onMouseUp) instead of Application.application.addEventListener(MouseEvent.MOUSE_UP, onMouseUp), the event gets fired outside of the swf-window...

however. thx...

February 10, 2010 | Unregistered Commenterkweso

PostPost a New Comment

Enter your information below to add a new comment.

My response is on my own website »
Author Email (optional):
Author URL (optional):
Post:
 
Some HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>