|
Dear
Friend,
Hello
& welcome back to Firewire,
your friendly guide to the exciting world of web-design
& web-solutions!
Menu
system helps visitor to reach on desired page easily
& quickly. When site contains lot of main links
& sub links, it becomes difficult for web designer
to maintain users friendly navigation. With the basic
knowledge of Flash 5.0, you can create most users' friendly
menu system with link & sub links.
Check
out the example menu system given below, when you click
on a main button (titled button1, button2 & button3)
you will notice animated drop down list of sub buttons,
(sub button1, sub button2&..) clicking on any of
the sub button will take visitor to desired page, &
animation will reversed so as, drop down menu will merge
within main button.
Click
here to download the source (.fla) file.
|
1.
Create a new movie with dimensions of 550px
X 400px
and fps=30 with white
as background color.
For the menu we
have to create total six buttons.i.e. one main button and
remaing five as sub buttons.
1.
Choose Insert > New Symbol
2.
Create a movie clip and name it as 'button panel'.
3.
Select rectangle tool in the tool box and draw a rectangle.
4.
Give a gradient color fill to the rectangle.
5.
Choose Insert > New Symbol
6.
Create a new button and name it as 'Button1'
7.
Select the frame 1 in 'Button1' button.
8.
Select Window > Library > button
panel movie clip
9.
Drag the button panel movie clip from the library into
the button1 at the center.
10.
Rename the layer as button panel.
11.
Select frame4 at Hit stage.
12.
Choose Insert > Frame.
13.
Insert a new layer (Choose Insert
> Layer) above the button panel layer.
14.
Type 'Button1' text on this layer.
15.
Choose Window > Panels > Text
Options.
16.
In the Text Options panel keep Use Device Fonts
option on.( it helps to keep font crisp)
17.
Select the 'Button1' text.
18.
Choose Insert > Convert to Symbol.
19.
Create a movie clip and name it as 'button 1 text'.
20.
Rename Layer 2 as button 1 text.
21.
Select frame 2 at Over stage.
22.
Choose Insert > Keyframe.
23.
Select button1 text movie clip at frame2.
24.
Choose Window > Panels > Effect
25.
In the Effect panel change the Tint of the button
1 text movie clip.
26.
Insert a new layer (Choose Insert
> Layer) below the button 1 text layer.
27.
Select Window > Library > button
1 text movie clip.
28.
Drag the button 1 text movie clip on newly added Layer
3.
29.
Choose Window > Panels > Effect
30.
In the Effect panel change the Tint of the button
1 text movie clip and make it white.
31.
Keep this white tinted button 1 text movie clip slight
down and slight left.
Now
your button is ready.Similarly you have to create remaining
5 buttons i.e. Sub Button1,Sub Button2,Sub Button3,Sub Button4
and Sub Button5.
Create
these buttons and give them names accordingly.
|
