Likno Blog – Drop-Down Menus, Javascript Menus, CSS Menus, jQuery Scrollers/Sliders, Modal Windows and more...

The 5.2.798 version of the AllWebMenus Web Menu Maker introduces the feature "Show Item or Group on Appear" (under the Main Menu's Group Properties), which specifies whether an Item whose LINK property matches the URL of the loaded web page will be highlighted by default.

By selecting "Automatically, based on URL", any item whose property matches the URL of the web page that is being viewed will be displayed with its [Mouse Over] or [Mouse Click] state instead of its [Normal] state, thus creating a "highlighting" effect.

Example 1:

Let’s assume that your web menu has a “Company” item that links to the company.html page:

Suppose you browse the following URL:

If the "Show Item or Group on Appear" property of the web menu is set to "Automatically, based on URL" using its "Mouse Click" values, then the menu will appear as follows:

All items are displayed at their [Normal] state except of the “Company” item which is displayed at its [Mouse Click] state, implying that the page viewed is linked by this item.

Example 2:

Let’s assume that your menu has a “Product 2” item in the Products Submenu Group, that links to the product2.html page:

Suppose you browse the following URL:

If the "Show Item or Group on Appear" property of the web menu is set to "Automatically, based on URL", then the menu will appear as follows...

...and when you select the "Products" submenu then the "Product 2" item will be highlighted by default, implying that the page viewed is linked by this item.

As you can see, the parent item (in this case the "Products" item) is also highlighted in order to indicate that a submenu item (i.e. "Product 2") matches the URL of the viewed page.

Note: If multiple items within the web menu link to the same page then all matching items will be highlighted.

Note: The following article describes how you can keep a menu item highlighted automatically. If for some reason (e.g. earlier version users) you would like to use the manual method of keeping a menu item highlighted based on the URL of the loaded page, please read more information here.

New options have been added to the <Type> property on AllWebMenus version 5.1.740!

"Horizontal" groups (like the Main Menu group) could always behave as "Menubars" (fitting the entire window width). These menubars can now use additional options, like specified margins from the window sides, etc.

Here are all the Options you can use on the <Type> property:

Option 1: Horizontal Menu

More Options on Horizontal Menus:

"Do you want your group to use multiple rows?"

By selecting "Yes, use X rows", your group will use X rows to display the items.

Example with 2 rows:

"Should the menu function as a Menubar?"

By clicking "Yes, Widen group to fit entire window width", the group acts like a typical Windows-application menu: horizontal, covering all the width of the window even when the user resizes it.

You can also add Margin in any of the sides of the menu (Right, Left, or both) counted in pixels or in percentage of the page:

"Do you want the items to widen to fit their group's width?"
(enabled when the "Menubar" functionality is selected)

By selecting "Yes, widen items so that they fit the entire group" the items of the menu will widen in order to cover the whole size of the menu.

By selecting "Do not widen items" the items will keep their default size and the background color of the menu will cover all the width of the window.

Option 2: Vertical Menu

More Options on Vertical Menus:

"Do you want your group to use multiple columns?"

By selecting "Yes, use X columns", your group will use X columns to display the items.

Example with 2 columns:

"Allow Vertical Scrollbar?"

By selecting "No Scrollbar" the group will widen to fit all items.

By selecting "Auto: when group height exceeds browser window height", a scrollbar will be added in the menu when its size exceeds the browser window height in order for the viewer to be able to view all the items.

By selecting "Fixed", a scrollbar will be added when the group size exceeds the pixels you have set in the related box:

The Uniform Items option

This option allows you to choose whether the size of all items match the size of the biggest item within the same group. The calculation of the largest size includes the size of the Header or Footer too (if they exist).

Example:

1st menu: The <Uniform Items> property is set to "no"

2nd menu: The <Uniform Items> property is set to "yes"