1. Скачать дистрибутив. http://www.gmarwaha.com/jquery/lavalamp/zip/lavalamp-0.2.0.zip Скопировать файлы *.js в папку с шаблоном.
2. В шаблоне:
2.1. Подключаем css:
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/style/menu.css" type="text/css" media="screen" />
Содержание файла menu.css:
.menu {
position: relative;
height: 29px;
/*width: 421px;*/
background-color: white;
padding: 15px;
margin: 10px 0;
overflow: hidden;
border: 1px solid gray;
}
.menu li {
float: left;
list-style: none;
}
.menu li.back {
border: 1px solid #000;
background-color: #e6e8ea;
width: 9px;
height: 30px;
z-index: 8;
position: absolute;
}
.menu li a {
font: bold 14px arial;
text-decoration: none;
color: #000;
outline: none;
text-align: center;
top: 7px;
text-transform: uppercase;
letter-spacing: 0;
z-index: 10;
display: block;
float: left;
height: 30px;
position: relative;
overflow: hidden;
margin: auto 10px;
}
.menu li a:hover, .menu li a:active, .menu li a:visited {
border: none;
}2.2. Подклюаем *.js например:
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/js/jquery-1.2.3.min.js"></script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/js/jquery.easing.min.js"></script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/js/jquery.lavalamp.min.js"></script>
<script type="text/javascript">
$(function() {
$("#menu").lavaLamp({
fx: "backout",
speed: 700,
click: function(event, menuItem) {
return true;
}
});
});
</script>3. Редактируем файл /modules/mod_mainmenu/helper.php:
После (159 строка)
$xml->addAttribute('class', 'menu'.$class);добавляем:
$xml->addAttribute('id', 'menu'.$class);4. Редактируем файл /modules/mod_mainmenu/tmpl/default.php
вместо (45 строка)
$node->addAttribute('class', 'active');пишем
$node->addAttribute('class', 'current');Материал сформирован (описана интергация с mod_mainmenu в Joomla) на основе статьи http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/