Aesthetic tweening 'roll offs'

programming flash
1

hiii everybody,

bear with me on this one…

The best way to explain my problem is to describe what i am trying to do. I have an image in my flash movie which will expand on a rollover. On the rollout, i want the image to contract back in. However, if the mouse cursor is ‘rolled out’ before the image has fully expanded, i want the image to shrink back in from the size it is currently at. (so if the picture is only half expanded, it will contract from that half size) I presume that this cannot happen using the functions of flash and must be scripted.

I have tried to search for a solution, but its hard to think of keywords for this problem, and so i have had to post this.

if anyone could either direct me to a tutorial, or give me some sort of hint as to how to go about this, it would be much appriciated.

thankyou in advance for any replies

Cudos

2

This is probably best accomplished with actionscript to expand it… something like:


setInterval(buttonExpand, 20, myButton1);
function buttonExpand(button){
if(button.hitTest(_xmouse, _ymouse, true) && button._xscale<200){
button._xscale += 10;
button._yscale += 10;
}
if(!button.hitTest(_xmouse, _ymouse, true) && button._xscale>100){
button._xscale -= 10;
button._yscale -= 10;
}
}

This will expand/contract the mc “myButton1”, I havent tested it though.

Edit:
Here is a version that makes it easy to add multiple buttons:


buttons = new Array(myButton1, meep);
for(i=0;i<buttons.length;i++){
 setInterval(buttonExpand, 10, buttons*);
}
//setInterval(buttonExpand, 1, myButton1);
function buttonExpand(button:MovieClip) {
 if (button.hitTest(_xmouse, _ymouse, true) && button._xscale<200) {
  button._xscale += 1;
  button._yscale += 1;
 }
 if (!button.hitTest(_xmouse, _ymouse, true) && button._xscale>100) {
  button._xscale -= 1;
  button._yscale -= 1;
 }
}

Just edit the “buttons” array :).

3

cheers dunga, if you ever read this again!!!

4

That’s a bit complicated… Just use a simple hit test…

onClipEvent (enterFrame) {
	if (this.hitTest(_root._xmouse, _root._ymouse, true)) {
		this.nextFrame();
	} else {
		this.prevFrame();
	}
}

Edit: That is, if you have actual frames for the button movement… If it’s a movieclip with tweens, or such.

5

cheers morse, that one makes life a little easier.

6

Thanks, glad to help :thumb: And yes, my second example is complicated, but it saves coding in the long run- just one thing to add for a new button. Frames work well too, if you want a more customized animation.