If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)



This is an “Accoridion” Script. So-called “Accordion” is a drop-down panel that holds some additional content.

In order to make the script work, the index-#.html file with an “accordion” should contain these lines of HTML code:

The <head> section of the index-#.html file contains these lines of code that initialize the script functionality with basic values:

Let us examine this coding.

First of all, we hide all “accrodion” elements starting from the second (here numbering starts from ‘0’):

The next block of coding shows all “accrodion” elements on click event (when the link with the .show_more_events class is clicked):

The next block of coding shows only basic “accrodion” elements on click event (when the link with  the .show_recent_only class is clicked):

“Accordion” is represented by a bullet list (<ul> tag) with the .events class.
Below you can see the HTML script representation:

"Accordion"-1, 3.5 out of 5 based on 2 ratings