This tutorial will teach you how to create advanced flash menu using the icons and Action Script Code. This icon menu you can use for any web site. Using this tutorial, you will also learn:

1. How to use instance name,
2. How to convert icon into a movie clip symbol,
3. How to apply action script code on icon to make it more powerful and more.

Example:



Step 1

Create a new flash document, choose Modify > Document (Ctrl+J) and set Width to 370 and Height to 100px. Frame rate set to 30fps (Frames per Second).





Step 2

Insert a new layer and name it icons. After that, create five icons, which will represent your icon menu. You can also download my icons.



Step 3

Select the first icon, press F8 on the keyboard (Convert to Symbol), and convert it into a Movie Clip.



Step 4

While the new made Movie Clip is still selected, go to the Properties Panel (Ctrl+F3) below the stage. On the left side, You will find the Instance name input field there. Call this Movie Clip icon1.



Step 5

Double-click on the movie clip on stage with the Selection tool(V).You should now be inside the Movie Clip.



Step 6

Select only this part of icon:



and press Ctrl+X (Cut).

Step 7

Create a new layer, select it and press Ctrl+Shift +V (Paste in Place).

Step 8

While the part of icon is still selected, press F8 key on the keyboard (Convert to Symbol) to convert this part of icon into a Movie Clip.



Step 9

Click on frame 10 and press F6 key.



Step 10

Select the Free Transform Tool (Q), press and hold down Shift key and enlarge this part of icon a little, like it is shown on the picture below.



After that, while the new made Movie Clip (part of icon ) is still selected, open the Properties Panel (Ctrl+F3). On the right, you will see the Color menu. Select Alfa in it and put it down to 42%.

Step 11

Click again on frame 10, open tha Action Script Panel (F9), and paste this script:

stop();

Step 12

Go back on frame 1, open the Properties Panel (Ctrl+F3), under Tween choose Motion and forRotate set CW. See the picture below.



Step 13

Select the layer 1 and press F6 (Keyframe) ten times. See the picture below.



Step 14

Click on every second frame and press delete key on the keyboard.



Step 15

Go back on the main scene (Scene 1). Then, insert a new layer and name it Invisble Buttons.



Step 16

After that, create the Invisible Button over the first icon. See the picture below.



Step 17

While your Invisible Button is still selected, go again to the Action Script Panel and enter the following action script code inside the actions panel:

on (rollOver) {
_root.mouse_over_icon1 = true;
}

on (rollOut) {
_root.mouse_over_icon1 = fstartlse;
}

on (release){
getURL("http://www.flashvault.net/", "blank");

}

Step 18

Insert a new layer and name it Action Script. Click on the first frame, and in Action Script Panel  (F9) paste this script:

_root.icon1.onEnterFrame = function() {
if (mouse_over_icon1) {
_root.icon1.nextFrame();
} else {
_root.icon1.prevFrame();
}
};

We're done for the first icon. Repat this steps for every other icon in menu.

Have a nice day!

Download source file (.fla)