Sometimes my handler function traces the event target as one of the child objects of the actual button, making the button lose focus and triggering the MOUSE_OUT event. I was using the following code:

movieOnStage.buttonMode = true;
movieOnStage.useHandCursor = true;
movieOnStage.addEventListener(MouseEvent.MOUSE_OVER, btnHandler);
movieOnStage.addEventListener(MouseEvent.MOUSE_OUT, btnHandler);
movieOnStage.addEventListener(MouseEvent.CLICK, btnHandler);
function btnHandler(evt:MouseEvent):void{
trace("btnHandler("+ evt +") triggered by "+evt.target.name);
if(evt.type==MouseEvent.MOUSE_OVER){
}else if(evt.type==MouseEvent.MOUSE_OUT){
}else if(evt.type==MouseEvent.CLICK){
}
}
Using object.mouseEnabled property on some of the offending sub clips looked like the first solution, but I really don’t want to specify that on every sub clip. Talk about static.

So, I noticed the MouseEvent had ROLL_OVER and ROLL_OUT events. Using those got rid of the focus issues I was having, but I didn’t know what the difference was.

Most AS3 button examples I see are using the MOUSE_OVER and MOUSE_OUT events, so maybe this will save someone some time when they run into the same issues.

For those interested, I did a little searching on the reason for this. From the docs:

“The purpose of the rollOver event is to simplify the coding of rollout behaviors for display object containers with children. When the mouse leaves the area of a display object or the area of any of its children to go to an object that is not one of its children, the display object dispatches the rollOver event. This is different behavior than that of the mouseOver event, which is dispatched each time the mouse enters the area of any child object of the display object container, even if the mouse was already over another child object of the display object container.”

More info on the MouseEvent: