invoker

12.4.11

Glass Aero Flash Menu with Fade Effect

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.

leaf600x400

- 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”

step11

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

step21

- Set the Fill Opacity to 50%
step2b2

- 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:
step2c2

- 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

step2d1

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:

step32

Step 4

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

- 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

0 komentar:

Posting Komentar