Bouncy Bouncy

programming flash
1

Hi guys!

I was wondering if anyone would be able to help me with an animation problem I’m having?

Basically, I’m trying to create a new menu that has a list of icons. When the user hovers over an icon, it ‘bounces out’ to show a full thumbnail of the picture. (A rubbish explanation I know, so I’ve put a sample of what I mean up at http://www.michael-smedley.co.uk/test.swf)

Now, I’ve added a transition effect so that it bounces when the mask gets to its full width. However, as you’ll probably notice from the demo, when the thumbnail goes back to its original size, it just goes really slowly. What I want is for it to go back to its original size at the same speed in which it grew, and was hoping someone would point me in the right direction?

The action script I am using is (note mask is the name of the object that grows/shrinks):


import mx.transitions.Tween;
import mx.transitions.easing.*;

stop();

this.onEnterFrame = function()
{
    if (back == true)
    {
        prevFrame();
    new Tween(mask,"_width",Bounce.easeOut,mask._width,50,1,true);
        new Tween(mask,"_height",Bounce.easeOut,mask._height,50,1,true);
    }
}
this.onRollOver = function()
{
    back = false;
    play();

new Tween(mask,"_height",Bounce.easeOut,mask._height,180,2,true);
}
this.onRollOut = function()
{
    back = true;
}
this.onRelease = function()
{
    getURL("item.php?item=1",_self);
}

and on another frame I have added this code to make it grow in width:


import mx.transitions.Tween;
import mx.transitions.easing.*;

new Tween(mask,"_width",Bounce.easeOut,mask._width,300,2,true);

I will appreciate any help given, even if it means that it doesn’t bounce on the way back!

Many thanks!!