Hello, we have released a new version of AllWebMenus Pro: Version 5.3 build #894.

Check out What's New

- Enhanced the "Custom Variables" feature of the "Text", "Link", "Status Bar Text" and "Tooltip" properties.

Now you can update any custom variables used by your menu within your page and immediately have their changed values reflected on the menu.

Optionally, this advanced feature can be used in combination with the "Manually trigger Main Menu or any Group on user action" positioning method, so that you show the same single menu on different page elements, using different "Link" values (or "Text", "Tooltip", etc.) on its items per each element.

For example, the following single menu (just one menu) can be used on many DVD images, where the "Link" properties of the menu items use different values per element (so that the linked page knows which DVD item calls it):

custom variables popup menu

read how to do this

- Added support for the "Link & Run Other Likno Projects (from menu)" feature in "Batch Compile".

- Fixed an issue related to css styles (IE only), in particular for "td {width: 50%;} img {float: left;}".

- Fixed some FrontPage related issues.

- Fixed an issue where the "Has Submenu Image" appeared in an item, despite its group was marked as "hidden".

All features here: http://www.likno.com/allwebmenusinfo.html

Download the new version of our CSS menu builder at http://www.likno.com/download.html


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


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):







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




Status Bar Text



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).



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.):


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:


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):


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: , , , , , , , , , , , , , , , , , , , ,


Dear Likno users, we are pleased to announce that we have just released our new product: The Likno Web Scroller Builder!

Likno Web Scroller Builder is a feature-rich tool for creating stylish, html scrollers/sliders for your web pages, with minimal effort and coding.

jQuery scroller/slider 1jQuery scroller/slider 2

View interface screenshots

Major Features
  • Rich and powerful interface!
    web scroller interface
  • Cross-browser
    Javascript engine supports all browsers, such as IE, Firefox, Chrome, Safari, Opera, Mozilla, Konqueror and more.
  • Cross-platform
    Javascript engine supports all platforms, such as Windows, Mac OS X, Linux, smartphones (iPhone, Android, Windows Phone, BlackBerry 6+) and more.
  • Cross-editor
    Works with all authoring tools (such as Dreamweaver, Expression Web, NetObjects Fusion, CoffeeCup, etc.), even a simple text editor!
  • Cross-CMS
    Works with all CMS and Blogs (such as WordPress, Joomla, Drupal, Typo3, DotNetNuke, Expression Engine, CMS Made Simple, etc.).
  • Create cross-browser jQuery scrollers to display content (items) that scroll horizontally or vertically when visitors click on (or mouse over) special navigation arrows, bars, and more.
  • ... OR make the scroller behave as a "SlideShow": its items sliding (scrolling) automatically, one at a time, at specified duration and direction, with looping or not, pause on "mouse over" and more.
    scroller slideshow
  • Use simple text, HTML code, images, videos (YouTube, etc.), animations, Flash as the content of your scroller items.
  • Create projects fast by using ready-made examples already installed in the application.
  • Universal: Use in all authoring tools (Dreamweaver, Expression Web, etc.) and CMS platforms (Joomla, Drupal, WordPress, etc.).
  • Create any type of jQuery scroller, such as: html scroller, javascript scroller, css scroller, ajax scroller, web scroller, vertical scroller, horizontal scroller, marquee, ticker, dhtml scroller, jquery ajax scroller, etc.
  • Use any of 4 methods to populate your scrollers with content:
    1. Scroller is populated by the project properties (within the application)
    2. Scroller is populated by a UL/LI structure, located inside your page.
    3. Scroller is populated by DIV elements, located inside your page.
    4. Scroller is populated by an external feed, such as RSS, ATOM, XML.
  • Position your scrollers easily on page and anywhere you like, with many options:
    1. Insert into a page element of your choice (div, span, td, etc.).
    2. Replace a page element (vs "insert into").
    3. Replace an image of your choice.
    4. Float, relative to the browser window (any corner).
    5. Float, relative to a page element of your choice (any corner).
    6. Float, relative to an image of your choice (any corner).
  • Customize the style of your scrollers through CSS ("css scrollers").
    CSS on scrollers
  • Apply images creatively to create interesting scrollers (images on scroller items, images on different "areas" such as "Top", "Bottom", "Left", "Right", etc.).
  • Use multiple scrollers on the same page (with the same or different styling).
  • Use additional Areas to your scroller around the main "Items Area" for extra information (a title, a footnote, etc.): the "Top Area", "Bottom Area", "Left Area", "Right Area".
    html scroller areas
  • Add dynamic content (database-driven or programmable) to your scrollers.
  • Use a tooltip on every scroller item (optionally), with plenty of styling options and dynamic HTML content.
  • Use a variety of transition behaviors (Continuous, Step by Item, Step by Page) and transition effects (Instantly, Fade, Slide), etc.
    html scroller transition effects
  • Use a variety of Navigation Bars to navigate through the scroller items. With CSS and dedicated properties to fully customize the appearance of "First", "Previous", "Next", "Last" buttons, text label, item numbers, background of the bar, mouse over effects and more.scroller navigation bar properties
    scroller navigation bars
  • Use a variety of Navigation Arrows to navigate through the scroller items (combined with the Navigation Bar or not). With many CSS and dedicated properties to fully customize their appearance.scroller navigation arrows propertiesscroller navigation arrows
  • Use Bullets to show paging (or even navigate through the scroller items).
  • Set a specific scroller item to be initially selected (on page load).
  • Use Rounded Corners around the scroller. Available in browsers that properly support CSS3 (IE9+, Opera 10.50+, Firefox 3.5+, Safari/Webkit 522+, Chrome and others). You can adjust the roundness of each corner all together or even separately!
  • Apply a Shadow to the scroller, in browsers that properly support CSS3 (IE9+, Opera 10.50+, Firefox 3.5+, Safari/Webkit 522+, Chrome and others).
  • Allow keyboard navigation on scrollers. The visitor can use the arrow keys to navigate through the items and the "P" key to "play/pause" their movement (if
    scroller keyboard navigation
  • Use complete help for all properties and procedures. Press F1 while you are on a property to immediately receive Help for that property.
  • Access additional designs (examples) of interesting scrollers, besides the designs coming with the application (note: applies to "Unlimited Domains" users).
  • Powered by the popular jQuery open source library.

All features here: http://www.likno.com/jquery-scroller/index.php

Download here: http://www.likno.com/jquery-scroller/download.php


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


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