website promotion banner
Free Stock Images
  • Create A Free Account
  • Download High-Res Stock Images For Free
  • +5 Million Images
Your Ad Here
Flash & Swish  Home Flash & Swish Flash Tutorials Creating Basic Flash Menu
rss

Creating Basic Flash Menu

Author: Kotetsu More by this author


1. Before we begin creating the whole navigation system were going to have to create a new document depending on how many links you need. In this tutorial I will be making a vertical menu.

2. Now go to "Modify", "Document ", and give the document these settings:

image 1

3. Now that we have the size and fps (frames per second) set right, go to "Window", "Library" and a small window should pop up in the lower right corner. Voila its the library! It will look like this:

image 2

4. Go to the library and click on this button:

image 3

5. A window should pop up asking your what type of symbol you would like to create. We are going to create a button, so select button and I just named it button:

image 4

6. Your timeline will change and you should see up, over, down, and hit. Like below:

image 5

7. Before we create anything I'm going to explain what each frame does.

Up - the buttons up-state, when the cursor is not over or pressing the button
Over - what the button will look like when the cursor is over the button
Down - the appearance it will have once you click on the button
Hit - the area in which the button is clickable (usaully left blank)

8. Now that we have all that explained we are going to create a square in the "Up" frame. Like so:

image 6

9. We will do the "Over" frame now, to do this just insert a keyframe and you will see the shape you just created in the "Up" state. Now just change the fill color and/or stroke color. Example:

image 7

10. For this frame just do the same and change the colors, or you can leave it blank and it won't change once you click on it, it will just look as if it were in the "Over" state. I did change the colors for an example:

image 8

11. Now that we have the button created click the arrow in the upper left corner to go back to the main stage:

image 9

Now look at the library and you should see the button you just created. Drag it onto the stage and place it where you want it to be in the menu.

Example:

image 10

12. For the rest of the buttons just copy it and then paste as many as you need, then modify the documents size to fit your button quantity and size:

image 11

13. Now create a new layer in the timeline and name it text, make sure it is above the layer you have the buttons on. Make sure you create all of your text on that layer. Now you can place your text over each button like so:

image 12

14. Amost done!, now we have to add links to the buttons using actionscript. To add actionscript to a button you must first select it. Now open your actionscript window and place this code in each button:

"on (release) {
getURL("YOUR LINK");
}

*Replace "YOUR LINK" with the what your hyperlinking to (index.php, or http://www.alteredconcept.com), and remember you must SELECT a button to add actionscript to it.

Download Source File

Final Result:

(without actionscript)

All Done! Woah that was a long one.



Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Creating Basic Flash Menu"