Плюсы данного решения:
- Работает на mootools и не тянет за собой jquery или ченибудь подобное.
- Не подключает внешних файлов скриптов - в мутулзе уже встроен класс Accordion.
- Не требует установки новых модулей - все делается на уровне шаблона
Минусы я заметил такие:
- Проблема когда на сайте два и более модуля меню (можно решить).
- Немаленький размер кода инициализации - 40 строк кода.
Как сделать:
Создаем пустой текствый файл default.php в templates/your_template/html/mod_mainmenu/ . Если такой папки нет - создайте ее.
Вставляем туда
[spoiler title=вот это вот]
[/spoiler]
если ктонить шарит в js и mootools, помогите упростить код:
[spoiler title="accordion js"]
window.addEvent('domready', function(){
$$($('{$params->get('tag_id')}'), $('{$params->get('tag_id')}').getElements('ul')).each(function(el){
accParentItems = el.getChildren().filterByClass('parent');
accTogglers = [];
accElements = [];
accParentItems.each(function(element, index){
accTogglers.push(new Element('span').injectTop(element));
accElements.push(element.getElementsByTagName('ul')[0]);
element.index = index;
element.addEvent('mouseover', function(){
if (this.getChildren().filterByTag('ul')[0].offsetHeight == 0) {
accTimer = this.parentNode.Accordion.display.delay(200, this.parentNode.Accordion, $(this).index);
}
});
element.addEvent('mouseout', function(){
if((accTimer != undefined)){clearTimeout(accTimer)};
});
});
if ( accParentItems.length > 0 ){
el.Accordion = new Accordion(accTogglers, accElements, {
opacity: false,
alwaysHide: true,
show: $$(accParentItems).indexOf($$(accParentItems).filterByClass('active')[0]),
duration: 200,
transition: Fx.Transitions.Quart.easeOut,
onActive: function(toggler, element){
element.parentNode.parentNode.setStyle('height', 'auto');
},
onBackground: function(toggler, element){
element.parentNode.parentNode.setStyle('height', 'auto');
element.setStyle('height', element.offsetHeight+'px');
}
}
);
}
});
});
[/spoiler]