The cssListMenu Plus has been equipped with enough features to bring you fully functioning all CSS styled list menus. Here we will go over the set of available options incorporated into the extension interface.
The Menu List area is comprised of 2 display lists. The 1st list on the left displays how many list menus there are on the page. The list on the right displays how many buttons are associated with the selected menu.
Pressing the + button on the List Menus list will add a new menu item to be added to your page. Pressing the - button will remove the selected menu from your page.
Pressing the + button on the Links List will add more buttons to your menu.
Pressing the - button on the Links List will remove a button from the menu.
Note: Removing buttons from the menu will remove them from the bottom up. For each click of the - button, the last button in the menu will be removed.
Note: You can of course add or remove links manually in your document from the Dreamweaver interface as well. They will reflect in the cssListMenu Interface when opened.
Pressing the Set as Active button will set the selected button as the active button for the menu for the particular page you are working on. The active button will be displayed in the menus over state configuration.
You can remove the active state from a button that has the active state applied to it. When the button selection in the links list is active, and you select it, the Deselect as Active button appears. When the Deselect as Active button is pressed, it deselects the current active button and restores it to a normal rollover button.
All of these settings should be set to a numerical value only. Do not type in px after the number.
Note: Horizontal buttons can be set to a "fixed" or "auto" width.
buttons will remain a fixed width regardless of the length of the button
* Enter into the width field the value you want for the buttons width.
buttons width is determined by the length of the individual buttons text.
* Remove any value that is in the width field,
* Type auto into the width field.
There are 2 sets of button color controls. One set is for the button norm state and the other is for the button over state.
The BG button ( background image ) will have a blue border when no image is assigned to the particular button state. If an image has been assigned, the BG button will change to a red border indicating a background image has been set for this state.
The MenuPreview Panel is a bit different visually between the Horizontal and Vertical interface. It allows for you to see how your menu will look as you are building, or changing it. Any time a choice is made the Panel updates with your changes.
Note: The 3 Button Attributes - Button Width, Border Thickness, and Padding are not reflected in the MenuPreview Panel. The Button Spacing will display up to a two pixel spacing. Even though these values are not reflected in the MenuPreview Panel, all values entered into the Button Attributes will apply to the actual menu inserted into your page.
The menu allows for 2 types of configurations to accommodate a wider variety of styling. If this option is selected, each button will have all 4 borders around it. This allows for a nice bevel type button and is also useful if all of the borders are the same color and spacing is used between the buttons.
Refer to the section on Border Tips for more details on how borders affect the overall look of the menu.
If this option is not selected only 3 borders will appear around each button. This allows for a clean presentation of all borders when no spacing is used between the buttons. Otherwise doubling of adjacent buttons would occur.
The menu is wrapped in a container div which supplies the missing border on the outer button. For the Vertical menu this is the top most button, and for the Horizontal menu it is the left most button.
This feature is a design time visual aid only. It doesn't add anything to the menu at all, rather allows you to set the backdrop color of the MenuPreview Panel to match the color of the area of the page where the menu will reside. This allows you to better judge how your color scheme will be presented when creating or changing your button colors.
This option, if checked, allows you to keep your current settings within the interface while exploring different border options from the Themes List. If you already have background images set for your buttons, or a certain color scheme in the interface you can switch between the different border configurations and your current color settings will not change.
If this option is unchecked, the current settings will change to the defaults when switching between the different options in the Themes list