Тема: Раскрывающееся вертикальное меню-аккордеон
Добрый день!
Помогите, пожалуйста!
Очень нужно чтобы вертикальное меню (например, левая колонка) раскрывалось по принципу "аккордеон". CSS и js-код есть. Как интегрировать в колонку это? или как можно изменить колонку в cms, чтобы работала данная система?
Вот ява-код:
<script type="text/javascript">
$(document).ready(function () {
$('#cssmenu > ul > li ul').each(function(index, e){
var count = $(e).find('li').length;
var content = '<span class=\"cnt\">' + count + '</span>';
$(e).closest('li').children('a').append(content);
});
$('#cssmenu ul ul li:odd').addClass('odd');
$('#cssmenu ul ul li:even').addClass('even');
$('#cssmenu > ul > li > a').click(function() {
$('#cssmenu li').removeClass('active');
$(this).closest('li').addClass('active');
var checkElement = $(this).next();
if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
$(this).closest('li').removeClass('active');
checkElement.slideUp('normal');
}
if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
$('#cssmenu ul ul:visible').slideUp('normal');
checkElement.slideDown('normal');
}
if($(this).closest('li').find('ul').children().length == 0) {
return true;
} else {
return false;
}
});
});
</script>
вот пример меню:
<div id='cssmenu'>
<ul>
<li class='active'><a href='/'><span>Главная</span></a></li>
<li class='has-sub'><a href='#'><span>Каталог</span></a>
<ul>
<li><a href='#'><span>Смартфоны</span></a></li>
<li><a href='#'><span>Планшеты</span></a></li>
<li><a href='#'><span>Ноутбуки</span></a></li>
</ul>
</li>
<li class='has-sub'><a href='#'><span>О компании</span></a>
<ul>
<li><a href='#'><span>Сотрудники</span></a></li>
<li><a href='#'><span>Вакансии</span></a></li>
</ul>
</li>
<li><a href='#'><span>Контакты</span></a></li>
</ul>
</div>