Alpha Navigation Button - Fireworks 2004 & 8

[andrew]

START:

STEP1: http://img130.imageshack.us/img130/3481/step1gr5.jpg
Open up a new fireworks file.

STEP2: http://img125.imageshack.us/img125/6710/step2wt9.jpg
Make the width 250 by 30 pixels and white canvas colour.

STEP3: http://img125.imageshack.us/img125/9849/step3pk9.jpg
Make a rectangle 250 x 30 and make sure its x:0 y:0. Make the rectangle the colour #AC3D2. Make sure it has no border.

STEP4: http://img125.imageshack.us/img125/2678/step4cz1.jpg
Click solid then click Fill Options.

STEP5: http://img125.imageshack.us/img125/1407/step5wp0.jpg
Make it a linear gradient.

STEP6: http://img130.imageshack.us/img130/9593/step6ai6.jpg
make it the other colour of this #148EF5.

STEP7: http://img125.imageshack.us/img125/2162/step7be1.jpg
Shape the lines on the rectangle like I have in the picture.

STEP8: http://img117.imageshack.us/img117/5284/step8lm5.jpg
Use the text samba is dead (download from a font site) and the size 28, colour white, with black border to the text. Put your text in the middle.


STEP9: http://img117.imageshack.us/img117/9755/step812gd8.jpg
Change the alpha to 75%.

STEP10: http://img125.imageshack.us/img125/4912/step9gn3.jpg
Add a frame (click beside the garbage can) then select the frame
(click it so its highlighted) then right click your text and press "Insert Slice".


STEP 11: http://img117.imageshack.us/img117/7571/step10rh9.jpg
Right click the text and press "add simple rollover behavior".


STEP12: http://img117.imageshack.us/img117/5937/step11kz9.jpg
click the slice, make sure its jpeg better quality, and your link (where the button goes).

STEP13:
Use the pointer and click on the gray. then at the right hand top corner it has the optimization window, make sure that says JPEG - Better Quality, make sure the quality is 80.

STEP14:
Press File at the top, then export, then put a place for it. make sure you have "include areas with slices" and
"put images in subfolder" selected. checked.

FINAL RESULT:
http://www.lightning.i9h.net/tutorial1/index.htm
P.S. on rollover the text highlights.

REDISTRIBUTION IS ALLOWED