Resize Your Photos for the Web with Fireworks or Photoshop CS6
How to Create and Encode Flash Video
How to Upload a Video Clip to YouTube

How to Create a Navigation Menu in Fireworks

A navigation menu is nothing but a collection of buttons all lined up neatly horizontally or vertically. You can use Fireworks to create a navigation menu. You do all the grunt work in Fireworks and then add the menu to an HTML document you’re creating in Dreamweaver. Talk about your applications that play well with others!

To create a vertical navigation menu, follow these steps:

1

Create a new document in Fireworks.

The document dimensions are the width and height of the area in which the menu appears in your HTML design.

2

Create a single button.

Select the button with the Pointer tool.

3

Hold down the Alt key (Windows) or Option key (Mac) and drag down.

This creates an instance of the button. After you start dragging, hold down the Shift key to constrain the motion vertically.

4

Release the mouse button when the instance is aligned to the bottom of the previous button.

Objects in Fireworks have a magnetic attraction to each other. The button actually snaps to the bottom of the button above it.

5

Repeat Steps 3 and 4 to flesh out your menu.

At this stage, you have a column of buttons with the same title. Not to worry; you’ll give each button its own identity in the following steps.

6

Select the first button in your menu.

If the Properties Inspector isn’t already open, choose Window→Properties.

7

In the Properties Inspector, enter the Link, alt, Target, Show Down State on Load parameters.

The target window in which the linked page appears. In most instances, _top is the proper choice. Your options are _blank, _parent, _self, and _top.

8

Select the second button. If the Properties Inspector isn’t already open, choose Window→Properties.

You modify parameters for each button, but you perform one extra step for each button other than those on the home page.

9

Type the title of the button in the Text field.

This changes the text that displays on the face of the button. Use the Properties Inspector to modify the other parameters of the button.

10

Repeat Steps 8–9 for the remaining buttons.

You can design horizontal navigation menus in the same manner. Create a document that’s the height of your button. The width of the document is the button length multiplied by the number of buttons. After you create the first button, use Alt (Windows) or Option (Mac) to drag the button right while you hold down the Shift key to create an instance of the button.

blog comments powered by Disqus
Get Images Ready for the Web with Photoshop
How to Add Sound to Your Page with CoffeeCup
How to Create an MP3 File
How to Embed a Video in a Web Page
How to Create Flash Audio for a Web Page
Advertisement

Inside Dummies.com