Menu G5 Examples: Highlight it

Menu G5 now checks the size of menu items when they switch between different stages. The size of a menu pad is determined when all its menu items are at normal stage, then if a menu item changes size when switching to other stages, you can specify, in addStyleItem(), how it should be aligned to its position at normal stage.

The options are:

left/center/right ... for horizontal alignment, default center.
top/middle/bottom ... for vertical alignment, default middle.

In this example, we set up the CSS to have a larger padding and bold font for top-menu items at highlighted stage, and use "center" and "bottom" alignments to give it a tab-like highlighting effect.

[Back to index page]

# # #