• Menu scripts
• Form widgets
• Table widgets
• Calendar scripts
• Javascript games
• About
• Contact
• Donate
• Terms of use

Also check out Demo 2 where we change brightness

This menu is tested on Firefox, IE 5.5, IE 6, Opera, Safari for Mac and Firefox for Mac.

Demo of menu: Look to the left

Move your mouse quickly over the menu items to see the color animations in action

ps! I have in the menu configuration defined the first menu item to be active.

You can use the color schemer at www.dhtmlgoodies.com to find your ideal colors for this menu. What you have to do is to find a background color for your menu items. Then find the amount you want to darken or lighten that color on mouse over.

This is done by use of the HSB color system. In the color schemer, you have text boxes for Hue, Saturation and Brightness at the right.

What you do is

1. Select a base color as background for your links. Write down this RGB color(format : #RRGGBB, example: #FF0000). The color schemer will now calculate Hue, Saturation and Brightness for this color and show it in the three text boxes.
2. Try to adjust the brightness(example: changing 90 to 75). You may try to change saturation instead. This version of the menu give you the choice between changing brightness or saturation on mouse over.
3. If you're satisfied with this color, write down the difference in brightness between your original color and the new one(example: 90-75 = 15).

These values is something you could use in this script to modify the layout

For this specific demo, I have chosen my sites background color as primary link color(#E2EBED) and 15 to be the amount to darken the color on mouse over.

You can also modify the small square at the left of each menu item. Size and color is all defined in Javascript variables.