1. First, what is a "Custom Variable"?

A custom variable is a javascript variable whose value you can update in your web page (through javascript) in order to alter the menu properties where they are used, based on your conditions or preferences.

The syntax of a custom variable is (whichever you prefer):

     <awm:myvar>

OR

<awm:myvar/>

 

Example:

image

The applicable properties where a custom variable can be used are:

ITEM PROPERTIES:

Text

Link

Status Bar Text

Tooltip

GROUP PROPERTIES:

Header Text

Header Tooltip

Footer Text

Footer Tooltip

If you click on the "Compile Properties" toolbar button and then the "Custom Variables" option you will see any custom variables detected to be "in use" by your project (read more about this functionality in the AllWebMenus Help section there).

image

 

2. OK, so how can I use "Custom Variables" to show the same single menu with differentiated values, when this menu is triggered as a "popup" by different page elements?

Read below how you can show the same single menu on different page elements, using different "Link" values on its items per element.

Let's assume that you have several images on your page that display different DVD movie posters.

Each of these images shows the same menu when clicking on it, offering 3 actions (menu items) for the particular DVD that opens it ("view it", "purchase it", "rate it", etc.):

image

Now, each item of that menu links to a page related to its action (e.g. the "Purchase DVD" item links to the "purchase.php" page, etc.). In order for the linked page to know which DVD opens it, there is also a parameter at the end of the URL (e.g. "?dvd_id=13").

For example, these are the menu links when "Item 13" (DVD 13) triggers the menu:

image

But how can you use a different link value on the same menu, depending on which image (page element) triggers its appearance?

This is how:

1. In AllWebMenus, use a custom variable at the final part of each item's "Link" property (instead of a "hard coded" value):

image


2.
In your page, first specify the value of this custom variable (with javascript) and then manually trigger the appearance of the menu (also with javascript):

<img src="movie-poster-13.jpg" onclick="custom_dvd_id=13;awmShowGroup('menu-gr0',0,3,0,0,this);">

For each different page element (DVD image) use a different value prior to calling the same menu. For example:

<img src="movie-poster-14.jpg" onclick="custom_dvd_id=14;awmShowGroup('menu-gr0',0,3,0,0,this);">

<img src="movie-poster-15.jpg" onclick="custom_dvd_id=15;awmShowGroup('menu-gr0',0,3,0,0,this);">

<img src="movie-poster-16.jpg" onclick="custom_dvd_id=16;awmShowGroup('menu-gr0',0,3,0,0,this);">

In that way, the menu links eventually use a different value in their URL parameters depending on which page element (DVD image) opens it.

For more information on how to manually trigger a menu (on demand, as a "popup menu") please read the AllWebMenus Help topic of the "Manually trigger Main Menu or any Group on user action" positioning method.

Tags: , , , , , , , , , , , , , , , , , , , ,

 

Hello!

We have released new version of AllWebMenus Pro: Version 5.3 build #880.

Check out What's New:

- Added the "Keyboard Navigation" property to specify if the user can navigate through the menu by using the keyboard (arrow keys). "Shift-F12" gives the focus to the first item of the Main Menu, so that the user can then use the arrow keys to navigate from there.

menu keyboard navigation

- Enhanced the "Manually trigger groups" positioning method with more options (method also renamed to "Manually trigger Main Menu or any Group on user action").

manually trigger popup menu

manually trigger popup menu generator

- Fixed a minor issue when two or more "Server Side Menus" exist in the same page: image preloader was trying to preload non existing images.

- New version for all "Server Side Menus API" related products.

- Fixed an issue where submenus with unfolding effects didn’t appear properly in Chrome 64-bit environments only.

Download the new version at http://www.likno.com/download.html

Tags: , , , , , , ,

 

Hello,

We wanted to inform you that we have released the latest version of AllWebMenus, version 5.3 build 830.

Check out What's New:

- Added support for manually trigger groups in all SSM related products.

- Added support for exporting the menu project in a zip file.

- Fixed an issue where menu positioned itself improperly when aligned to top-right or bottom-right corner (IE only).

- Fixed an issue where Text Margin was not taken into account in UL/LI structure.

- Fixed an issue in WordPress Addin Import/Update Menu Structure function.

- Fixed an issue related to root-relative links when base url exists on page (Opera, Mozilla).

You can download the latest version of AllWebMenus at: http://www.likno.com/download.html

Tags: , , , , , , , , , ,

 


© 2009-2013 Likno Blog – Drop-Down Menus, Javascript Menus, CSS Menus, jQuery Scrollers/Sliders, Modal Windows