Customize the pop-up menu

You return to the Pop-up Menu Editor to modify the appearance of the pop-up menu.

1. In Fireworks, double-click the pop-up menu outline.

   The Pop-up Menu Editor appears with your entries displayed.

2. Click the Next button.

   The Appearance tab appears. This is where you can change the colors and fonts used in pop-up menus.

   
   
   

3. Select HTML as the cell type and Vertical Menu as the alignment.
4. Select Verdana, Arial, Helvetica, and sans-serif as the font and 12 as the font size.
5. In the Up State section, set the text color to black, if black is not already selected. Then click the Cell color box. If CCCCCC is not already displayed in the text box at the top of the color pop-up window, type CCCCCC and press Enter.

   These color values are the default colors selected in the Pop-up Menu Editor if you've never created a pop-up menu before. After you change these colors, they will be used every time you create a pop-up menu, until you choose other colors.

6. In the Over State section, set the text color to white if it's not already selected, and click the Cell Color box. Click the eyedropper pointer on the blue rectangle on the canvas that surrounds the Worldwide Airports graphic, as shown in the following illustration:

   
   
   

7. Click the Next button.

   The Advanced tab appears. The Advanced tab allows you to change various cell and border properties. You decide to increase the cell width to make the pop-up menu appear wider.

   
   
   

8. From the Cell Width pop-up menu, select Pixels.

   This step activates the Cell Width box.

9. Enter 137 as the cell width.
10. Select Automatic from the Cell Height pop-up menu, and click the Next button.

    The Position tab appears. This is where you can specify the position of the pop-up menu on the screen. Coordinates of 0,0 mean that the upper-left corner of the pop-up menu will align with the upper-left corner of the slice that triggers it. There are also several preset positions you can choose from.

    
    
    

11. Enter 3 in the X and Y Menu Position boxes, and then click Done.

    NOTE

    You can also reposition a pop-up menu by dragging its outline in the workspace.

12. Preview your pop-up menu changes in a browser.

    Move the pointer over the Worldwide Airports graphic. The pop-up menu is positioned differently and appears wider. Roll over each entry in the menu to see your color changes.

13. Save your work.

Send me an e-mail when comments are added to this page | Comment Report

Current page: http://livedocs.adobe.com/fireworks/8/fwhelp/gs_06_16.htm

Add Comment