In this tutorial we will learn how to make vista aero flash menu with awesome fade effect in Flash CS3.

What we do

Step 1

- Open Adobe Flash CS3 and create a New File (CTRL + N) with Action Script 2 and press OK.

- Go to Modify Menu – Document (CTRL + J) and set:

• Dimensions – Width – 600 and Height – 400
• Framerate - 25
• Background Color – White and click OK

- Find a cool Wallpaper with Leafs and cut it to 600×400, or you can use this wallpaper.

- Now drag and drop this wallpaper in Flash.
* Be sure after dragging that your picture must have 600×400 size. So click on it and change from the Properties Panel the width and height and X – Y Axis to 0,0

- Now  Layer 1 to “background” and create another one and rename it “body”

Step 2

- Block the background Layer by clicking near the color of the Layer.

- Select the body Layer and draw a white rectangle with white border using Rectangle Primitive Tool

- Your rectangle should  have

• 400 Width and 30 Height
• Rectangle Corner Radius - 6
• Stroke Hinting Checked

- Set the Fill Opacity to 50%

- Select rectangle and go to Modify Menu – Convert to Symbol or Press F8 and choose Type: Movie Clip and click OK.

- On the Properties Panel, Click on Color Drop Down Menu and Select Alpha to 50%

- On the Filters Panel, Click the Plus Button and Add a Glow Filter with:

• Blur X,Y to 10
• Black Color
• Strenght: 150%
• Quality: High

You should have this:

- Now select your object and go to Modify Menu – Convert to Sybmor or press F8 and select Type – Button and press OK.

- Double click your button and IN IT  Insert a New Layer and creat a text using Text Tool – Video Tutorials

Step 3

Very Good ! Now let’s add some Fade Effect on Rollover.

A little right above layers are 4 Mouse Actions: UP – OVER – DOWN – HIT

Click on the block below the OVER Action and press F6 or Right Click and Insert Keyframe for all 2 layers

Select the object from the OVER Action and press F8 and convert it in Movie Clip again.

Double Click it and select Frame 20 and press F6 or Right Click – Insert Keyframe.

- Between Frame 1 and 20 right click and Select Create Motion Tween.

- On the Last Frame click your object and set Alpha to 70% and from Filters, 50% Strenght and White Color

- And press F9 for Actions Window and write stop(); on the last frame. You should have this:

Step 4

- Now we must multiply our button. Go to Root.

- Select your button and press CTRL + C to Copy and after CTRL + SHIFT + V to Paste in the same Place and move with SHIFT + ARROWS to move a little bit down, near your first button.

- Very Good now your buttons are the same. Everytime you modify something on any button it will change to all. So what we have to do?

- Right Click on the Second Button and select Duplicate Symbol and Click OK.

- Double Click and you are free to change your text now for both layers ! (use CTRL + C and CTRL + SHIFT + V to paste in the same place)

- The Action Script Code for your button is:

on(release) {
	getURL("http://www.extremestudio.ro/blog/?cat=3", _blank); // _blank or _self
}
 

- Repeat this steps for every button you copy and paste.

Final Results and Download FLA

Download Files