Glass Aero Flash Menu with Fade Effect
In this tutorial you will learn how to make a Vista Aero Flash Menu with awesome fade effects in Flash CS3, using Action Script 2.
Also you can check a similar tutorial in Photoshop CS5:
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”
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
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:
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:
getURL("http://www.extremestudio.ro/blog/?cat=3", _blank); // _blank or _self
Repeat this steps for every button you copy and paste.