Drop down menu

Written by: Adrian Wherry
Difficulty Level: begining
Requirements: Flash 5
FLA to Download
Part 1

Introduction
Welcome to the Drop-Down Menu tutorial. In this tutorial we are going to look at simple but dynamic way of creating a drop-down style menu using flash animation. The effect on your web page is stunning and it is very versatile in that it can be used with frames pages or single pages with tables, etc.

Example:
Click on the arrowed tab to reveal the menu buttons.


Preparation
Before we start constructing our menu in Flash, we first need to create our buttons and button cover in a graphics package. It can be constructed just as easily within Flash, but I have chosen a 3rd party graphics package to give the graphics a bit more depth...in this case I have used Fireworks 3 (as it is a macromedia product and integrates seamlessly with Flash and Dreamweaver), but any of the good graphics packages (PaintShop Pro, PhotoShop, PhotoSuite. etc) will perform just as well.

Tip:
PaintShop Pro provides a simple 'buttonize' effect if you don't want to spend too long on the graphics.

Dimensions
Cover Size: 194 x 175 pixels
Button Size: 191 x 44 pixels
Note: These dimensions are not set in stone!

Constructing the Drop-Down Menu
Now we come to actually building the menu in Flash.

Step 1.
Click the 'New' button on the toolbar. Set the movie dimensions by clicking on MODIFY > MOVIE or press the Ctrl+M keys. (See figure 1.)

figure 1.

Create two new layers and label them cover and buttons. (See figure 2.)


Figure 2.