Likno Blog – Drop-Down Menus, Javascript Menus, CSS Menus

Feature available since Build #204, August 24, 2011, of Likno Web Accordion Builder

This option allows you to add special HTML links in your web page, so that your visitors can "Show All" (or "Hide All") accordion panes at will (also known as "Expand All / Collapse All" functionality).

Note that this option cannot be available when the panes are “co-dependent”, because in such case only 1 pane can be open at any time. If you want to change from "co-dependent" panes to "independent" panes you must edit the “Accordion Behavior” property.

View a full implementation of this feature at "Example 11 (show hide all)" (Preview and Sample Code):
 

(note: sample links are not shown in Preview or Sample Code of other projects when enabling this option; only "Example 11 (show hide all)" shows them there)

How does this feature work?

First, enable (check) this option.

Then, position any of the following HTML links anywhere you like in your web page:

·    <a href="javascript:void(0);" class="likno_accordion_generic_showAll">Show All</a>

Clicking on the above link shows all panes.

·    <a href="javascript:void(0);" class="likno_accordion_generic_hideAll">Hide All</a>

Clicking on the above link hides all panes.

·    <a href="javascript:void(0);" class="likno_accordion_generic_toggleAll">Show All/Hide All</a>

Clicking on the above link shows or hides all panes (toggle).
 
Especially for the "toggleAll" case you may also use any of the following optional code (anywhere in page) in order to specify different content for four different states:
 
<script>

var likno_accordion_project1_toggleAll_HTML_show      = "Show All";

var likno_accordion_project1_toggleAll_HTML_show_over = "<b>Show All</b>";

var likno_accordion_project1_toggleAll_HTML_hide      = "Hide All";

var likno_accordion_project1_toggleAll_HTML_hide_over = "<b>Hide All</b>";

</script>

Some important rules:

- All links above are optional. You can use only the ones that are related to the functions that you want. For example, you may want to use only the "toggleAll" link, and not the "showAll" or "hideAll" ones.

- If you have more than one accordion controls using this option in the same page, then you must change the "_generic_" part in the filenames to the "compiled javascript project" name of the related accordion. For example, for this accordion project...

...you should use the following names:

likno_accordion_project1_showAll

likno_accordion_project1_hideAll

likno_accordion_project1_toggleAll

(similarly with the optional variables)

likno_accordion_project1_toggleAll_HTML_show

likno_accordion_project1_toggleAll_HTML_show_over

likno_accordion_project1_toggleAll_HTML_hide

likno_accordion_project1_toggleAll_HTML_hide_over

You should do this only if you have multiple accordion controls in the same page, otherwise don't bother as the "generic" name will work for any accordion no matter its name.

Hello!

We have released a new version of Likno Web Accordion Builder: Version 2.0 build #204.

Check out What's New:

- Added new property: Show All/Hide All ("expand all/collapse all" feature). This feature is presented in the "Example 11 (show hide all)" project, included in the application.

View the "Show All/Hide All" example online

- Fixed an issue when no "line-height" was defined in the CSS.

- Minor improvements in the interface.

- Upgraded/Renamed "Example 11 (show hide all)" so that it displays the usage of this feature.

Download the new version at http://www.likno.com/jquery-accordion/download.php

"Horizontal Accordion Control", used by the CALC Institute of Technology

This accordion control was applied at the following page, on February 2011:
http://www.calc4it.com/resource_library.php

(note: please inform us if the Likno control is broken or non-updated by its author, since February 2011)

Hello everybody,

just some weeks after the initial release and we continue to add more features!

This is what's new in Build #120:

- Example Pack 02 is now available to all users of the "Unlimited Domains" license, with extra examples (designs).

- Added the "Get more examples" button in the "Background Set" and "Indicator Set" forms.

- Added more positioning options for the Indicator Set.

- Added "special" examples with custom "sample code".

- Fixed an issue with the width of the headers of horizontal accordions, when a Background Set was used for their background.

- Fixed some issues with the "Floating" positioning method (when the window was resized).

Likno Web/HTML Accordion Builder will save you significant time and effort required to understand DHTML, JavaScript and jQuery code for creating neat HTML accordion and slider controls!

- Features: http://www.likno.com/jquery-accordion/index.php
- Examples: http://www.likno.com/jquery-accordion/examples.php
- Download: http://www.likno.com/jquery-accordion/download.php

Likno Web/HTML Accordion Builder costs $49.95 (3-domain license). Windows ME/2000/NT/XP/Vista/7 supported.

Hello everybody,

just some days after the initial release and we continue to add more features!

This is what's new in Build #118:

- Added the "Play/pause/navigate through external page buttons" option, which allows the visitors to "play/pause" or "navigate" (previous, next, first, last) the accordion panes at will, by clicking on special buttons (images) on the page.

- 6 sets of "play/pause/previous/next/first/last" buttons (images) now available for the "Play Panes" feature.

- 3 new Example Projects added (12L, 13L, 14).

Some of the many features of Likno Web Accordion Builder:

• Rich and powerful interface!
• Create cross-browser jQuery accordions (Firefox, IE, Chrome, Opera, Mozilla, Konqueror, Safari, etc.) to display content when visitors click on (or even mouse over!) page elements (accordion headers) of your choice.
• Use simple text, HTML code, images, videos (YouTube, etc.), animations, Flash, or whole pages (AJAX, URL) as content in your accordions.
• 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 accordion control, such as: vertical accordion, horizontal accordion, jquery accordion, jquery slider, jquery toggle, accordion menu, collapsible panel, ajax accordion, javascript accordion, CSS accordion, accordion panel, etc.
• Create both vertical and horizontal accordions, with headers on any side (Top, Bottom, Left, Right). Panes can open/close horizontally too!
• Set the accordion panes as co-dependent (only 1 pane open at any time) OR totally independent (any number of panes open at any time).
• Use any of 3 methods to populate your accordions with content:
  1. populated by the project properties (within the application)
  OR
  2. populated by a UL/LI structure, located inside your page.
  OR
  3. populated by DIV elements, located inside your page.
• Position your accordions easily on page and anywhere you like, with many options:
  1. Insert into a page element of your choice (div, span, td, etc.).
  OR
  2. Replace a page element (vs "insert into").
  OR
  3. Replace an image of your choice.
  OR
  4. Float, relative to the browser window (any corner).
  OR
  5. Float, relative to a page element of your choice (any corner).
  OR
  6. Float, relative to an image of your choice (any corner).
• Customize the style of your accordion through CSS ("css accordions").
• Apply images creatively to create interesting accordions (images on accordion headers, image-based backgrounds etc.).
• Use multiple accordion controls on the same page (with the same or different styling).
• Add dynamic content (database-driven or programmable) to your accordions through AJAX techniques ("ajax accordions").
• Show and hide the panes in your accordion using a variety of show/hide effects.
• Optionally use an "Indicator" image on the headers of the accordion panes (panes can open/close when clicking on that image instead of their entire header area).
• Set as initially open (on page load): a specific pane OR all panes OR no pane.
• Make the accordion behave as a "SlideShow": its panes opening automatically, one at a time, at specified duration and direction, with looping or not, pause on "mouse over" and more.
• Use complete help for all properties and procedures. Press F1 while you are on a property to immediately receive Help for that property.
• Powered by the popular jQuery open source library.

Likno Web/HTML Accordion Builder will save you significant time and effort required to understand DHTML, JavaScript and jQuery code for creating neat HTML accordion and slider controls!

- Features: http://www.likno.com/jquery-accordion/index.php
- Examples: http://www.likno.com/jquery-accordion/examples.php
- Download: http://www.likno.com/jquery-accordion/download.php

Likno Web/HTML Accordion Builder costs $49.95 (3-domain license). Windows ME/2000/NT/XP/Vista/7 supported.