Create buttons (Buttons) and navigation bars (navigation Bars)

Button | create Create button (Buttons) and navigation bar (navigation Bars) (next)


We created a button just now and we can use this button to easily create the navigation bar. In fireworks you can use the same button repeatedly derived a series of similar buttons to form a navigation bar, without having to repeatedly create multiple similar buttons, greatly reducing the workload, this is the magic of fireworks place!!! Now let's go and see how it's done.

Open the library version, drag the home button to the artboard, repeat the action several times, so that there are more than one home button in the artboard, where I put 4 of the same buttons.


After putting these buttons in order, select Window->object to open the object surface and select a button to see the relevant parameters in the object plane, where the button text is the text of each button, We can change the text of the button on the artboard just by modifying the text in the object plane. Select Current in the pop-up window, and if you select all, change the text on all the buttons on the artboard. Notice the library version, and you will automatically generate a button every time you change it.


After finishing preview the effect of the navigation bar, the green is clicked (down) after the button state, white is usually (up) state, yellow is the mouse suspension (over) of the state.


If you are satisfied, you can output the image into HTML code, select File->export in the pop-up window to set the format of the output. Select include Areas without slices will also output the part that is not cut to the corresponding size of the picture, if not selected will be a 1x1 size of the transparent GIF picture (spacer.gif) to open the cell. Select put Images in subfolder to save the picture in a different directory.


Click option to enter more detailed settings.
General: Sets the suffix name of the output file, the case of the file name, and the corresponding Web page editor.
Table: Setting table parameters, it is recommended that you use the default method, which uses Spacer.gif to open blank cells to make the output look the same in IE and Netscape.
Document specific: To set rules for automatic naming files, it is worth mentioning that there is a fairly important option hidden here multiple Nav Bar HTML Pages, which determines whether to output an HTML file or multiple HTML files. If you choose, Fireworks generates an HTML page for each button, and the button is down on the page. If you want to determine the file name of the HTML file, go back to the file name section of the Link wizard window, instead of using the automatic name to manually enter the name of the button, so that the button's file name corresponds to the output of the HTML file name.


From the creation of buttons and navigation bar we can experience the convenience of fireworks, it is really designed for web authoring software, previously in Photoshop for a button dynamic effect of multiple files, adjusted to output multiple files after the day is gone.