Topic: Flash Button when cursor is removed?

Hi this may be a really simple thing to achieve but tried a few things and cant get it to work. What I have done is created an movie clip within a button so when the cursor rolls over it the movie clip alphas in from 0 to 100% then has a stop action on the 5th frame to display the image. What i would like is for when the curson rolls of the flash button the image simply alphas out from 100% to 0 over 5 frames rather than just dissapear abruptly. Any ideas? thx Eddie

Re: Flash Button when cursor is removed?

Been a while since I last touched flash, but I used to do this all the time.

Ok, so set up your animation, make a new layer for your actions (in case you haven't already).  Put a keyframe on the last frame with stop();
On the first frame put this:

stop();
this.onRollOver = function() {
	rewind = false;
	this.play();
};
this.onRollOut = function() {
	rewind = true;
};
this.onEnterFrame = function() {
	if (rewind == true) {
		prevFrame();
	}
};

Basically when your mouse is on top of the button the animation will play forward, and when it's not it plays in reverse.  What's great about this method is that you can even touch a button in the middle of an animation and it will still do what you'd except without jerking the animation around or starting over from the beginning, etc.

I had to open up an old project to get this code, so while I was in there I just made a simple "tutorial" to show you.
http://chris-barr.com/files/buttons.swf
http://chris-barr.com/files/buttons.fla (saved as Flash 8)

Last edited by C.Barr (2008-05-08 18:04:01)

Re: Flash Button when cursor is removed?

ha thx alot you are my favourite person at the moment :-)

works great

Eddie

Re: Flash Button when cursor is removed?

I think that C.Barr's solution is pretty good, although I tend to steer away from "onEnterFrame" loops and having the playhead play in reverse.  I've read that can cause strain on the Flash player's performance.  The nice thing about this method though as C.Barr explained is that the animation is fluid if you roll on or off during the animation. 

The only other thing I would add to this, which I add to all of my rollovers, is an "onDragOut" function.  That way if you're user clicks on the button, holds and drags out of the area of the button the reverse animation still happens.  Otherwise your button will remain in it's "over" state.  The code is very simple:

this.onDragOut = function() {
   rewind = true;
};

Re: Flash Button when cursor is removed?

Good call on that kob!  That's always bugged me when I worked in flash and I didn't know there was a solution.  Too bad I don't use Flash any more...