S5 Vertical Accordion

Extensions

S5 Accordion Menu
S5 Box
S5 Tab Show
S5 Map it With Google
S5 Flex Menu
- Drop Down Menu
- Menu Module Example
- Grouped Child Menu
  - Dummy Sample Link
  - Dummy Sample Link
  - Dummy Sample Link
  - Dummy Sample Link
  - Dummy Sample Link
  - Dummy Sample Link
- Menu With No Menu Icon
S5 MailChimp
S5 Image and Content Fader
S5 Masonry
S5 Weather Module
S5 Live Search

Sample Drop Down Module

This is an example of a module published to the drop_down row. This row contains 6 modules. To enable the drop down simple publish any module to any of the drop_down_x positions.

Open Panel

Search Our Site

495 - 495 -5154

Top Row1 Modules

This is an example of a module published to the top_row_1 row. This row contains 6 modules, read below for a full description.

Top Row2 Modules

This is an example of a module published to the top_row_2 row. This module is using the class "-white" which can be used on any dark background. This row contains 6 modules, read below for a full description.

Top Row3 Modules

This is an example of a module published to the top_row_3 row, it is shown using the class suffix -white_large. This row contains 6 modules, read below for a full description.

Details: Written by Super User; Category: Demo Info; Published: June 09, 2014; Hits: 63469

The S5 Vertical Accordion module is demonstrated on the left side of this page.

This module contains up to 10 module positions that appear in an accordion function so you can publish any of your favorite modules or custom html modules to one of the accordion slides and keep your site clean and consolidated while giving it a nice effect. The styling of the module shown here is customized specifically for this template with css overrides, and cannot be used with any other template. The same module can be used on any template, but with default or other styling in its place.

Features at a Glance:

Responsive/Fluid layout
Set the width of the module
Onclick or Onmouseover trigger methods
Auto cycle or manual for transition
Set slide transition speed
Compatible with IE7+, Firefox, Opera 10.5+, Safari, Chrome

-highlight1line

This is the -highlight1line module style and can be applied to most module positions.

-highlight2line

This is the -highlight2line module style and can be applied to most module positions.

Right

This is an example of a module published to the right position. There are also left, insets, rows, etc. positions and many others, be sure to read the full description. This is the default style that will appear for most module positions in the white body area.

-dark

This is the -dark module style and can be applied to most module positions.

-gray

This is the -gray module style and can be applied to most module positions.

-highlight2

This is the -highlight2 module style and can be applied to most module positions.

-highlight1

This is the -highlight1 module style and can be applied to most module positions.

-default

This is the -default module style and can be applied to most module positions and removes any padding that is added by a module output with no module class applied. We used on the homepage for several modules such as S5 Masonry, S5 Tab Show, etc

Bottom Row1 Modules

This is an example of a module published to the bottom_row_1 row. This row contains 6 modules, read above for a full description.

Bottom Row2 Modules

This is an example of a module published to the bottom_row_2 row. This row contains 6 modules, read above for a full description.

Bottom Row3 Modules

This is an example of a module published to the bottom_row_3 row. This row contains 6 modules, read above for a full description.

Sample Sidebar Module

Home

Pages