Click SWF to play the example. Right-click
(or Control-click/Mac) FLA to
download the file and see the Timeline, etc.
Note: If you get a Missing Font Warning when you open the FLA
in Flash, it's okay. Click the Use Default button.
The buttons in these examples don't do anything when you click
them, other than show their Down (pressed) state. Making buttons do
things is the subject of Lesson 5.
> Basic Buttons
The file shows one simple button with text as part of the button (left),
and another simple button (center and right) that does not include
text. You
can place text above a blank button in your movie, reusing the same
blank button many times. Click on the text above the center and right
buttons to see that it is separate from the button.
SWF :: FLA
> Invisible Button
You can make "invisible" buttons and position them over top of something
else, so that when the mouse rolls over that object, something happens. The
trick is to use the Hit frame in the button symbol. Open the FLA, and
double-click the button symbol to see how it works.
SWF :: FLA
> Invisible Button, Version 2
This example builds on the previous one. The same button was edited to be a bit
more user-friendly. Open the FLA, and double-click the button symbol to see
how it works.
SWF :: FLA
For more about creating invisible buttons, see Tip No. 10.
> Text-Only Button
Compare the two different buttons in this file. If you use text alone
as a button, it’s
best to create a rectangle in the Hit frame to cover the entire text
area -- otherwise,
the button will not work when the mouse cursor is between two letters,
or on the empty space in the middle of an O. When the mouse cursor
is on the word, the hand cursor symbol (indicating something that’s
clickable) will flicker on and off repeatedly as the mouse moves over
the letters; this can drive users crazy! It also makes the button difficult
to click.
SWF :: FLA
> Basic Button with Sound
Because the sound is on the Down frame in the button Timeline, you hear it only when the button is clicked.
SWF :: FLA
> Glow Button with Two Sounds
In this file, there is one sound on the Over frame in the button
Timeline, and a different sound on the Down frame. (The gradient
effect is achieved by using the Color Mixer panel.)
SWF :: FLA
> Layered Button
You can use layers in a button symbol’s Timeline to make it easier
to construct and later edit various parts of a complex button design.
SWF :: FLA
Download all FLA files for this lesson (requires Flash MX
or later):
> Windows (.zip) 90 KB
> Mac (.sit) 83 KB
|
