PDA

View Full Version : Animated rollover frustration


weavermedia
01-13-2009, 03:37 PM
I'm trying to find the best and most robust way of detecting a mouse over event on a button. I have an animation within the button mc that animates to the rollover state. I want to use prevFrame() to return back to the rollout state.

This code works fine when I mouse over slowly and let the animation play to each stop point, but if I mouse past the button quickly the rollover animation sticks and so does the nested looping animation within the button shape (a cheeky looping glint over the button to catch the eye). The SWF itself isn't breaking because the click handler is still working and opens the PNG when the button is clicked. Please help! Deadline looming!

stop();
butt.stop();
useHandCursor = true;
buttonMode = true;

addEventListener(MouseEvent.CLICK, buttCLICK);
addEventListener(MouseEvent.ROLL_OVER, rolledOver);
addEventListener(MouseEvent.ROLL_OUT, rolledOut);

function buttCLICK (e:MouseEvent):void
{
navigateToURL(new URLRequest("file:///C:/test.png"));
}

function rolledOver (e:MouseEvent):void
{
addEventListener(Event.ENTER_FRAME, doRollOver);
}

function rolledOut (e:MouseEvent):void
{
addEventListener(Event.ENTER_FRAME, doRollOut);
}

function doRollOver(e:Event)
{
butt.nextFrame();
if (butt.currentFrame==9){
butt.gotoAndStop(9);
removeEventListener(Event.ENTER_FRAME, doRollOver);
}
}

function doRollOut(e:Event)
{
butt.prevFrame();
if (butt.currentFrame==1){
butt.gotoAndStop(1);
removeEventListener(Event.ENTER_FRAME, doRollOut);
}
}

weavermedia
01-14-2009, 10:37 AM
I've sorted this out now. After some experimentation I found the problem was when you mouse over the button very fast both the rollOver and rollOut (and their associated ENTER_FRAME functions) functions are called on the same frame which causes a constant prevFrame/nextFrame to occur which locks the button animation and any nested animations within the button.

The solution is simply to add an extra removeEventListener into the rollOver and rollOut functions to get rid of any potential conflict:

function buttOver(e:Event):void
{
removeEventListener(Event.ENTER_FRAME, alphaDown);
addEventListener(Event.ENTER_FRAME, alphaUp);
}

function buttOut(e:Event):void
{
removeEventListener(Event.ENTER_FRAME, alphaUp);
addEventListener(Event.ENTER_FRAME, alphaDown);
}