[thelist] Flash animation button [Was] Resources to learn flash

Jono ox4dboy at comcast.net
Thu Aug 19 15:34:29 CDT 2004


On 8/18/04 9:44 PM, "Rich Points" <rich at richpoints.com> wrote:

> Maybe you can help me.  I'm creating a button that says Donate Today!   I've
> created a movie that spells it one letter at a time, one letter per frame.
> Once it's spelled I have an underline slide under it then it loops.  I did
> this by first typing Donate Today! and then created I created a symbol from
> it.  Then I broke the text apart.  Then I inserted keyframes consecutively
> and erased the letters as needed.
> 
> I then inserted the Donate Today! symbol into a button.  I changed the color
> of the text in the over frame.  I can see the animation but the over frame
> only seems to work on the last frame of the animation.

Try this:

:: | Creating the Movie Symbol | ::

This movie symbol will go into your button's

1. Type your text "Donate Today!" and then  select it with the arrow tool
and make it a graphic symbol. (Modify< Convert to symbol...< Graphic < OK

2. go to Insert< New symbol..., and make this symbol a Movie Clip

3.  Now you are inside you movie clip.  Drag the symbol you created in step
1 onto the stage.  Your symbol is now on "Layer 1"

4. Draw a rectangle, and convert it to a graphic symbol, name it mask.

5.  Drag "mask" from the library onto the stage onto layer 2.  Align the
RIGHT edge of the mask rectangle to the LEFT edge of your text "Donate
Today!"  Make sure you mask rectangle is large enough to completely cover
the text "Donate Today!"

6.  Now you have layer 1 and layer 2 in the time line.  Add a Key Frame in
layer 20 on both layers.

7.  Click on frame 20 in Layer 2 (the layer you mask rectangle is in) and
drag the rectangle symbol on the stage so that it is completely covering
"Donate Today!"

8. Right click the layer mask layer (Layer 2) and select "Mask"

9.  Right click on frame 1 of layer 2 (the layer with your mask symbol) and
select "Create Motion Tween"

10.  Press play/Enter to see what happens.

11.  Create 2 new layers (Layer 3 & 4), and use the same method above to
animate in your underline.

12.  In the movie clip, give frame 1 a label of start.  Give the last frame
a action of gotoAndPlay("start");

13.  Create 2 new graphics for the button's "Over" and "Down" state.

:: | Creating the Button Symbol | ::

13.  Create a new symbol, and make it a button symbol.

14.  In your new button symbol, drag the movie clip you made in step 2 from
the library into frame 1 (the up frame) of the button.

15. Click on the "Over" frame and insert a key frame.  Drag the graphic you
made for the button's over state (in step 13) into the "Over" frame.  Click
on the "Down" frame, insert a key frame, and drag the graphic symbol you
made (in step 13) for the button's "Down" state into the "Down" frame.

16.  In the "Hit" frame draw a rectangle that will define the button's hot
area.

Your done, the button will now do what you wish.  I created a really crappy
mockup if you are interested, I can mail you off list?



More information about the thelist mailing list