- Веб-Шаблоны
- Шаблон интернет-магазина
- Шаблоны для CMS
- Facebook шаблоны
- Конструктор сайтов
«Accordion»-3
Ноябрь 15, 2010
This is an «Accordion» Script. So-called «Accordion» is a drop-down panel that holds some additional content.
JavaScript
In order to make the script work, the index-#.html file with a gallery 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:
First we show the first ‘accordion’ element, setting .active class for header element (<dt> tag) and applying .show() method for content element (<dd> tag):
The rest of the coding makes ‘accordion’ panels to animate when panel titles (<dt> tags) are clicked:
HTML
Below you can see general HTML script representation:
The ‘accordion’ is formed by a list (<dl> tag) with .accordion class.
In order to add another ‘accordion’ element you will just need to add the following HTML code construction:
CSS
You can find script related stylesheet in the main style.css file.