Applying behaviors to slices
So far we have told the slices their names and how they should
be exported. We have not assigned any behaviors. What are behaviors?
Behaviors are things that "happen" when you mouse over
an element. A language called JavaScript makes these things happen.
Fireworks will create automatically the necessary JavaScript code,
so you don't have to learn JavaScript.
 |
The behavior we will assign to
the slices is called Set Nav Bar Image. We have to open the
behavior panel, which is on the right of the Object panel.
We still have all slices selected so we can assign the behavior
to all of them at once. In the behavior panel we need to press
the plus icon .
This will give you the list of predefined behaviors shown
in the screen shot on the left. |
Select the Nav Bar Image behavior. A dialog window will open in
which a preview of the nav bar is shown.
 |
You can see that there are five
navigational elements, namely the five slices we created earlier.
The white part on the left is not part of the navbar and therefore
is not included in the behavior. |
Although there is an options panel we don't have to select any
of the option, we are all set. The behaviors panel will look like
this:
 |
The panel reflects
the settings of the selected slices. Since all the slices
we have currently selected have the same behavior Fireworks
is able to display it.
If there were one slice with a different behavior attached,
Fireworks would say "multiple Selections".
For now our navbar is finished and we should be able to preview
the behavior before we go and export it to HTML. We will use
the Fireworks internal preview. |
Previewing the nav bar
Select
the preview tab from the document tabs in the left upper corner.
This will allow you to actually see the functionality within Fireworks.
The Web layer will be displayed in the preview unless you turn it
invisible. You can do that through the layers panel or the quick
way by using the view portion of the tools panel.
The
left selection turns the Web layer off. The right icon makes the
slices visible. This feature works both in the document mode and
the preview mode.
|