|
To start off, open up Macromedia Fireworks. If you are continuing
from the Rollover Button tutorial,
you can safely close Dreamweaver for now. The Fireworks button that
you have created is all we will use from the previous tutorial.
This tutorial is written assuming that you are continuing from the
previous tutorial.
Your button should
look like this.
Make sure that the slice is selected then,
Click Modify
- Pop-Up Menu - Add Pop-Up
Menu

The Pop-Up Menu Editor
will open up. The Pop-Up Menu editor is a window with four tabs:
Content, Appearance, Advanced, and Position. All four of these windows
can be seen below.
Content

|
Appearance  |
Advanced  |
Position

|
The first
window, the Content window, is where you enter the text that you
would like to appear, and the pages that you would like your text
to link to. The number of items you enter will determine the number
of items that will be displayed in your pop-up menu.

As you can see, I've
added two items in my pop-up menu. The top one will display "Lehigh"
while linking to http://www.lehigh.edu. Similarly, the second item
will display "IMRC" while liking to http://www.lehigh.edu/~inimr.
The Target
column tells the browser how to display the linked document.
_blank
will open up a new browser window to display the page in, _parent
will open the link up inside of the current frame (if your site
does not use frames, _parent is the same
as _top),
_self loads the document in the same window in which it was
clicked in, and
_top will remove all frames in the current
window and display the linked document in the current window, using
the full window.
If the column is left
blank, _self is the default.
The next tab, the
Appearance tab, allows you to customize the text size, the background,
font, alignment, and many other properties of your links.

I've chosen to create
a pop-up menu with a graphical background (You have a choice of
HTML or Image). I've also selected to have the contents displayed
vertically and to use the default font in size 14. The bottom two
options (Up State and Over State) determine how the button will
appear when someone does not have their mouse pointer over
your graphic (Up State) and how it will appear when someone does
have their mouse pointer over your graphic (Over State). You
do not need to select the same options I have here, this tab is
strictly preference.
The next tab, Advanced,
determines the dimensions of the pop-up menu, padding, spacing,
and the delay (the amount of time after the mouse has left the graphic
that the pop-up menu will remain visible)

Everything on this
tab can be left alone. The only thing you may want to adjust is
the Menu Delay. The default of 1000 milliseconds
(1 second) should be fine for now.
The next tab, Position,
will determine the X & Y coordinates of where the menu is displayed.

The default value
of (0,0) will place your pop-up menu in the top-left corner of your
graphic, like the button below.
A common method is
to make the Y-coordinate approximately equal to the height of your
button. This way, the pop-up menu appears on the bottom of your
button. You can, of course, customize your own.
For my button, I've
chosen an X-coordinate of 50, which makes the button relatively
centered, and a Y-coordinate of 48, which makes the menu appear
just below the graphic.
Click Done
to close the Pop-Up Menu editor.
Your button should
now have a light blue outline of where the pop-up menu will appear.
If you would like to adjust the position of the pop-up menu, simply
click on it with the black arrow tool, and move it.
The next step is Exporting
your button and pop-up menu to Dreamweaver for use in a web page.

|